@charset "utf-8";

/* d-card */
.d-card {
	display: flex;
	justify-content: center;
	align-items: center;
}

.d-card img {
	width: auto;
	aspect-ratio: 678/426;
}

/* d-card-layer */
.d-card-layer {
	display: flex;
	justify-content: center;
	align-items: center;
}

.d-card-layer img {
	width: auto;
	aspect-ratio: 337/256;
}

input::placeholder {
	color: var(--placeholder);
	font-weight: 400;
}

textarea::placeholder {
	color: var(--placeholder);
	font-weight: 400;
}

/* com_btn */
.com_btn {
	text-align: center;
	background: var(--main-color);
	border-radius: var(--common-radius);
	height: calc(100vw * (62 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--white-color);
	margin-top: auto;
	padding: calc(100vw * (20 / var(--design-width))) 0;
	width: 100%;
}

.com_btn.unable {
	background: var(--box-bg-color);
	color: var(--unable-color);
}

.com_btn.default {
	background: var(--white-color);
	color: var(--black-color);
	border: 1px solid var(--btn-border-color);
}

.com_btn.etc {
	width: auto;
	height: calc(100vw * (52 / var(--design-width)));
	padding: 0 calc(100vw * (20 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
}

/* splash_wrap */
.splash_wrap {
	width: 100vw;
	min-height: 100vh;
	background-color: var(--background-color);
	padding: calc(100vw * (69 / var(--design-width))) calc(100vw * (31 / var(--design-width)));
}

.splash_wrap img {
	width: calc(100vw * (161 / var(--design-width)));
}

.splash_wrap .title {
	margin-top: calc(100vw * (30 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
	line-height: 1.4;
	color: var(--black-color);
}

.splash_wrap .tit {
	margin-top: calc(100vw * (20 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.4;
	color: var(--gray-color);
}

/* ob_wrap */
.ob_wrap {
	padding: 0 calc(100vw * (25 / var(--design-width)));
	background: var(--background-color);
	width: 100%;
	min-height: 100vh;
	text-align: center;
}

.ob_wrap .title {
	padding-top: calc(100vw * (68 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (24 / var(--design-width)));
	line-height: 1.4em;
}

.ob_wrap .slider {
	width: calc(100vw * (257 / var(--design-width)));
	margin: 0 auto;
}

.ob_wrap .tit {
	margin-top: calc(100vw * (13 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (15 / var(--design-width)));
	line-height: 1.2em;
	color: #A3A3A3;
}

.ob_wrap .swiper-slide {
	padding: calc(100vw * (10 / var(--design-width)));
	padding-bottom: 0;
	margin-top: calc(100vw * (47 / var(--design-width)));
	margin-bottom: calc(100vw * (117 / var(--design-width)));
	width: calc(100vw * (257 / var(--design-width)));
	height: calc(100vw * (334 / var(--design-width)));
	background-color: #FFF;
	box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.02);
	border-radius: calc(100vw * (18 / var(--design-width))) calc(100vw * (18 / var(--design-width))) 0px 0px;
}

.ob_wrap .swiper-pagination {
	position: absolute;
	bottom: 50px !important;
}

.ob_wrap .swiper-pagination-bullet-active {
	background-color: #595A5B;
	width: calc(100vw * (18 / var(--design-width)));
	border-radius: var(--common-radius);
}

/* signup_wrap */
.signup_wrap {
	background-color: var(--background-color);
	padding: calc(100vw * (50 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
	width: 100%;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.signup_wrap.pw_wrap {
	padding: calc(100vw * (50 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
}

.signup_wrap.full {
	padding: calc(100vw * (50 / var(--design-width))) 0 0;
}

.signup_wrap.sub {
	min-height: calc(100vh - calc(100vw * (50 / var(--design-width))));
}

.signup_wrap .title {
	font-size: calc(100vw * (20 / var(--design-width)));
	line-height: 1.4;
	font-weight: 600;
	display: flex;
	width: calc(100vw * (240 / var(--design-width)));
	flex-direction: column;
	margin: calc(100vw * (30 / var(--design-width))) 0 calc(100vw * (20 / var(--design-width)));
}

.signup_wrap .title.title--type {
	margin: calc(100vw * (70 / var(--design-width))) 0 0 calc(100vw * (20 / var(--design-width)));
}

.signup_wrap .title .img_logo {
	width: calc(100vw * (240 / var(--design-width)));
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

.signup_wrap .sub_tit {
	color: var(--gray-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	margin-top: calc(100vw * (8 / var(--design-width)));
	margin-bottom: calc(100vw * (24 / var(--design-width)));
}

.signup_wrap .subtitle {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--black-color);
	margin: calc(100vw * (8 / var(--design-width))) 0 calc(100vw * (-20 / var(--design-width)));
}

.signup_wrap .title.lang_title {
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	padding-bottom: calc(100vw * (20 / var(--design-width)));
	border-bottom: 1px solid rgba(0,0,0,0.05);
}

.signup_wrap .title.forgot {
	font-weight: 600;
}

.signup_wrap .title.forgot span {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.signup_wrap .title.forgot .forgot_title {
	margin-bottom: calc(100vw * (12 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
}

.signup_wrap .com_btn {
	margin-bottom: 0;
}

.signup_wrap .com_btn.fixed {
	position: fixed;
	bottom: calc(100vw * (20 / var(--design-width)));
	width: calc(100vw * (343 / var(--design-width)));
}

.signup_wrap .check_group {
	margin-top: calc(100vw * (60 / var(--design-width)));
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

.signup_wrap .all_check {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 calc(100vw * (16 / var(--design-width)));
	height: calc(100vw * (64 / var(--design-width)));
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	color: var(--main-color);
	margin: 0 calc(100vw * (-16 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

.signup_wrap .all_check label {
	display: flex;
	align-items: center;
	gap: calc(100vw * (12 / var(--design-width)));
}

/* check_group */
.check_group .check_row_group {
	margin-top: calc(100vw * (32 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (25 / var(--design-width)));
	padding: 0;
}

.check_group .row {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.check_group .row label {
	width: 100%;
	font-weight: 400;
	font-size: calc(100vw * (15 / var(--design-width)));
	line-height: normal;
	display: flex;
	align-items: center;
}

.check_group .row label input {
	margin-right: calc(100vw * (12 / var(--design-width)));
}

.check_group .row .under {
	text-decoration: underline;
	font-size: calc(100vw * (13 / var(--design-width)));
	color: var(--gray-color);
	margin-left: auto;
}

.check_group .row .gray {
	color: var(--main-color);
	margin-right: calc(100vw * (4 / var(--design-width)));
}

/* signup_wrap */
.signup_wrap input[type="checkbox"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: transparent;
	border-radius: 50%;
	cursor: pointer;
	height: calc(100vw * (28 / var(--design-width)));
	min-width: calc(100vw * (28 / var(--design-width)));
	background: transparent;
}

.signup_wrap input[type="checkbox"]::after {
	border: solid var(--border-color);
	border-width: 0 2px 2px 0;
	content: "";
	display: block;
	height: 40%;
	left: 40%;
	position: relative;
	top: 20%;
	transform: rotate(45deg);
	width: 15%;
}

.signup_wrap input[type="checkbox"]:checked {
	background: transparent;
}

.signup_wrap input[type="checkbox"]:checked::after {
	display: block;
	border-color: var(--main-color);
}

.signup_wrap .com_btn.s2 {
	margin-top: calc(100vw * (251 / var(--design-width)));
}

.signup_wrap .input_group {
	margin-top: calc(100vw * (10 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (30 / var(--design-width)));
	margin-bottom: calc(100vw * (40 / var(--design-width)));
}

.signup_wrap .input_title {
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--gray-color);
}

.signup_wrap .phone input,
.signup_wrap .mail input {
	width: 100%;
	height: calc(100vw * (62 / var(--design-width)));
	padding: 0 calc(100vw * (8 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	background: #FFF;
	border-bottom: 1px solid var(--border-color);
	color: var(--black-color);
	font-weight: 600;
}

.signup_wrap .phone input:focus,
.signup_wrap .mail input:focus {
	border-color: var(--black-color);
}

.signup_wrap .mail input {
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.signup_wrap .phone .row {
	margin-top: calc(100vw * (10 / var(--design-width)));
	display: flex;
	gap: calc(100vw * (8 / var(--design-width)));
}

.signup_wrap .row_tit {
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.25em;
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.signup_wrap .phone .sm_btn {
	min-width: calc(100vw * (108 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border-radius: var(--common-radius);
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--main-color);
	border: 1px solid var(--main-color);
	text-align: center;
}

.signup_wrap .phone .sm_btn2 {
	min-width: calc(100vw * (108 / var(--design-width)));
	height: calc(100vw * (40 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	background: #595A5B;
	border-radius: var(--common-radius);
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	color: #FFF;
	width: 100%;
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.signup_wrap .timer {
	color: var(--caution-color);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%);
}

.signup_wrap .phone .sm_btn.active {
	background: var(--main-color);
	color: #fff;
}

.signup_wrap .phone .sm_btn.ok {
	background: var(--box-bg-color);
	color: #B8B8B8;
	border-color: var(--box-bg-color);
}

.signup_wrap .phone .row2,
.signup_wrap .row_tit,
.signup_wrap .recommend {
	transition: 0.5s;
	opacity: 0;
}

.signup_wrap.row2_hide .phone .row2,
.signup_wrap.row2_hide .row_tit,
.signup_wrap.row2_hide .recommend {
	height: 0;
}

.signup_wrap.row2_hide .phone.phone_select {
	display: none;
}

.signup_wrap .title_sm {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
	margin: 0 auto;
	padding-top: calc(100vw * (96 / var(--design-width)));
	text-align: center;
}

.signup_wrap .dot_group {
	height: calc(100vw * (14 / var(--design-width)));
	display: flex;
	gap: calc(100vw * (25 / var(--design-width)));
	align-items: center;
	justify-content: center;
	margin-top: calc(100vw * (87 / var(--design-width)));
}

.signup_wrap .dot_group .dot {
	width: calc(100vw * (8 / var(--design-width)));
	height: calc(100vw * (8 / var(--design-width)));
	border-radius: 50%;
	background-color: #D6D9E0;
	transition: 0.5s;
}

.signup_wrap .dot_group .dot.active {
	width: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	background-color: #59A8C8;
}

.signup_wrap .dot_group .dot.ok {
	width: calc(100vw * (8 / var(--design-width)));
	height: calc(100vw * (8 / var(--design-width)));
	background-color: #59A8C8;
}

.signup_wrap .num_pad {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	margin-top: calc(100vw * (161 / var(--design-width)));
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	row-gap: calc(100vw * (17 / var(--design-width)));
	column-gap: calc(100vw * (17 / var(--design-width)));
	padding: calc(100vw * (28 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
	background: linear-gradient(0deg, #EBEBF1, #EBEBF1), #F9F9FC;
	box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.01);
	border-radius: calc(100vw * (18 / var(--design-width))) calc(100vw * (18 / var(--design-width))) 0 0;
}

.signup_wrap .pad {
	width: calc(100vw * (97 / var(--design-width)));
	height: calc(100vw * (64 / var(--design-width)));
	background-color: #F1F1F5;
	box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.01);
	border-radius: var(--common-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 400;
	font-size: calc(100vw * (25 / var(--design-width)));
	line-height: 1.2em;
}

.signup_wrap .pad_A img {
	width: calc(100vw * (23 / var(--design-width)));
}

.signup_wrap .pad_B img {
	width: calc(100vw * (26 / var(--design-width)));
}

.signup_wrap .title.center {
	text-align: center;
}

/* welcome_wrap */
.welcome_wrap {
	padding: calc(100vw * (50 / var(--design-width))) 0 calc(100vw * (30 / var(--design-width)));
}

.welcome_wrap .title {
	margin: 0 calc(100vw * (16 / var(--design-width))) 0;
	font-size: calc(100vw * (24 / var(--design-width)));
}

.welcome_wrap .welcome {
	margin-top: calc(100vw * (30 / var(--design-width)));
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (35 / var(--design-width)));
	background: var(--box-bg-color);
}

.welcome_wrap .welcome .img_box {
	width: calc(100vw * (50 / var(--design-width)));
	height: calc(100vw * (50 / var(--design-width)));
	border-radius: var(--out-radius);
	background-color: #F1F1F5;
	display: flex;
	align-items: center;
	justify-content: center;
}

.welcome_wrap .welcome .img_box img {
	width: calc(100vw * (24 / var(--design-width)));
}

.welcome_wrap .welcome .row {
	display: flex;
	gap: calc(100vw * (12 / var(--design-width)));
	align-items: center;
}

.welcome_wrap .welcome .text_row {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (4 / var(--design-width)));
}

.welcome_wrap .welcome .row .text1 {
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
}

.welcome_wrap .welcome .row .text2 {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 400;
	line-height: 1.2;
	color: var(--gray-color);
}

.welcome_wrap .notice {
	margin: 0 calc(100vw * (16 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
}

.signup_wrap .notice {
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
}

.welcome_wrap .com_btn {
	width: calc(100% - (100vw * (32 / var(--design-width))));
	margin: auto calc(100vw * (16 / var(--design-width))) 0;
}

/* signup_wrap */
.signup_wrap .notice .n_title {
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.2;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.signup_wrap .notice span {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.4;
	color: var(--gray-color);
	padding-left: calc(100vw * (8 / var(--design-width)));
	text-indent: calc((100vw * (8 / var(--design-width))) * -1);
	display: block;
	margin-bottom: calc(100vw * (4 / var(--design-width)));
}

.signup_wrap .notice span:last-child {
	margin-bottom: 0;
}

.signup_wrap .com_btn.s3 {
	position: unset;
	width: 100%;
	margin-top: calc(100vw * (70 / var(--design-width)));
}

.signup_wrap .lang_wrap {
	padding: calc(100vw * (16 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
	width: 100%;
	height: calc(79vh - calc(100vw * (60 / var(--design-width))));
}

.language_wrap {
	background-color: var(--background-color);
}

/* lang_wrap */
.lang_wrap {
	padding: calc(100vw * (60 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
	width: 100%;
	height: 100%;
}

.lang_wrap .search_box {
	width: 100%;
	display: flex;
	align-items: center;
	height: calc(100vw * (50 / var(--design-width)));
	gap: calc(100vw * (14 / var(--design-width)));
	padding: 0 calc(100vw * (14 / var(--design-width)));
	background: #FFFFFF;
	box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.01);
	border-radius: var(--out-radius);
	margin-top: calc(100vw * (16 / var(--design-width)));
}

.lang_wrap .search_box img {
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	order: 2;
}

.lang_wrap .search_box input {
	font-weight: 400;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.333;
	color: var(--black-color);
	order: 1;
	width: calc(100% - (100vw * (38 / var(--design-width))));
}

.lang_wrap .search_box input::placeholder {
	color: #A3A3A3;
}

.lang_wrap .c_list {
	display: flex;
	flex-direction: column;
	padding-left: 0;
	overflow-y: auto;
}

.lang_wrap .c_list li {
	font-weight: 400;
	font-size: calc(100vw * (18 / var(--design-width)));
	height: calc(100vw * (60 / var(--design-width)));
	color: var(--black-color);
	background-color: transparent;
	display: flex;
	align-items: center;
}

.lang_wrap .c_list li.select {
	color: var(--main-color);
	position: relative;
}

.lang_wrap .c_list li.select:after {
	content: "";
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	background-image: url("../image/sub/lang_chk.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}

.lang_wrap .c_list li.on {
	font-weight: 600;
}

.lang_wrap .c_list li .flag {
	width: calc(100vw * (32 / var(--design-width)));
	margin-right: calc(100vw * (8 / var(--design-width)));
}

.lang_wrap .c_list li .lang_arw {
	width: calc(100vw * (24 / var(--design-width)));
	margin-left: auto;
	display: none;
}

.lang_wrap .blur {
	width: 100%;
	height: calc(100vw * (80 / var(--design-width)));
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(180deg, rgba(244, 244, 249, 0) 0%, var(--background-color) 100%);
}

.signup_etc_modal .modal_etc_text {
	max-height: 75vh;
	overflow: auto;
}

.modal_etc_text p {
	font-size: calc(100vw * (15 / var(--design-width)));
	line-height: 1.4 !important;
}

/* modal_country_group */
.modal_country_group {
	max-height: 75vh;
	overflow: auto;
	display: flex;
	flex-direction: column;
}

.modal_country_group .country_num {
	padding: calc(100vw * (15 / var(--design-width))) 0;
	border-bottom: 1px solid rgba(0,0,0,0.05);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.row1 .country_number {
	min-width: calc(100vw * (80 / var(--design-width)));
	height: calc(100vw * (50 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	background: #595A5B;
	border-radius: var(--common-radius);
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2em;
	color: #FFF;
}

.social_signup_btn {
	margin: calc(100vw * (20 / var(--design-width))) 0;
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (10 / var(--design-width)));
}

/* login_wrap */
.login_wrap {
	padding: calc(100vw * (50 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (60 / var(--design-width)));
	min-height: calc(100vh - (100vw * (50 / var(--design-width))));
	min-height: calc(100dvh - (100vw * (50 / var(--design-width))));
	display: flex;
	flex-direction: column;
	margin: calc(100vw * (50 / var(--design-width))) 0 0;
}

.login_wrap .en_title {
	color: var(--gray-color);
	text-align: center;
	font-size: calc(100vw * (16 / var(--design-width)));
	margin: calc(100vw * (70 / var(--design-width))) 0 calc(100vw * (12 / var(--design-width)));
}

.login_wrap .box_logo {
	height: calc(100vw * (37 / var(--design-width)));
	text-align: center;
}

.login_wrap .box_logo img {
	height: calc(100vw * (37 / var(--design-width)));
}

.login_wrap .en_tit {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: normal;
	color: var(--black-color);
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.login_wrap .login_input {
	margin-top: auto;
}

.login_wrap .input_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (12 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.login_wrap .login_input .input_group input {
	width: 100%;
	height: calc(100vw * (62 / var(--design-width)));
	padding: 0 calc(100vw * (12 / var(--design-width)));
	background: #FFFFFF;
	box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.01);
	border-radius: var(--common-radius);
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
	border: 1px solid var(--border-color);
}

.login_wrap .login_input .input_group input::placeholder {
	color: var(--placeholder);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
	box-shadow: 0 0 0px 1000px #ffffff inset !important;
	-webkit-text-fill-color: #333333 !important;
	transition: background-color 5000s ease-in-out 0s;
}

/* login_wrap */
.login_wrap .find_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.login_wrap .find_row .left {
	display: flex;
	align-items: center;
	gap: calc(100vw * (8 / var(--design-width)));
}

.login_wrap .find_row .left label,
.login_wrap .find_row .right {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
}

.login_wrap input[type="checkbox"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: transparent;
	border-radius: var(--common-radius);
	cursor: pointer;
	height: calc(100vw * (20 / var(--design-width)));
	width: calc(100vw * (20 / var(--design-width)));
	background: #D6D9E0;
}

.login_wrap input[type="checkbox"]::after {
	border: solid #FFF;
	border-width: 0 2px 2px 0;
	content: "";
	display: block;
	height: 40%;
	left: 40%;
	position: relative;
	top: 20%;
	transform: rotate(45deg);
	width: 15%;
}

.login_wrap input[type="checkbox"]:checked {
	background: #59A8C8;
}

.login_wrap input[type="checkbox"]:checked::after {
	display: block;
}

.login_wrap .signup_txt {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--black-color);
	text-align: center;
	margin-top: calc(100vw * (40 / var(--design-width)));
}

.login_wrap .signup_txt span {
	font-weight: 600;
}

.sns_login_group {
	display: flex;
	width: 100%;
	flex-direction: column;
	gap: calc(100vw * (10 / var(--design-width)));
	margin-top: auto;
}

/* commonPopTitle */
.commonPopTitle.email_send_tile {
	border-bottom: 0;
	padding-bottom: 0;
	margin-bottom: calc(100vw * (12 / var(--design-width)));
}

.commonPopTitle .email_send_tit {
	font-size: calc(100vw * (20 / var(--design-width)));
	color: var(--main-color);
	width: calc(100vw * (162 / var(--design-width)));
	display: block;
	margin: 0 auto;
	font-weight: 600;
	line-height: normal;
}

.commonPopText .email_send_txt {
	font-weight: 600;
	color: var(--main-color);
}

.mypage_wrap {
	background-color: var(--background-color);
}

/* my_wrap */
.my_wrap {
	padding: calc(100vw * (50 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (120 / var(--design-width)));
	width: 100%;
}

.my_wrap .profile {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: calc(100vw * (30 / var(--design-width)));
	padding: 0 calc(100vw * (10 / var(--design-width)));
}

.my_wrap .profile .left {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (4 / var(--design-width)));
}

.my_wrap .my_name {
	font-size: calc(100vw * (22 / var(--design-width)));
	line-height: 1.1;
}

.my_wrap .my_info_bottom {
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
}

.my_wrap .my_info_bottom .mail {
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
}

.my_wrap .my_pic {
	width: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	border-radius: 100%;
	overflow: hidden;
	border: 1px solid var(--border-color);
	box-sizing: content-box;
}

.my_wrap .my_pic img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.my_wrap .my_c {
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	color: #A1A7B0;
	line-height: 1.5em;
}

.my_wrap .profile .right {
	display: flex;
	align-items: center;
	justify-content: center;
}

.my_wrap .profile .right .qr_link {
	padding: 0 calc(100vw * (13 / var(--design-width)));
	border-radius: var(--out-radius);
	height: calc(100vw * (34 / var(--design-width)));
	background: var(--black-color);
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
	color: var(--white-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
}

.my_wrap .profile .right .qr_link::before {
	content: "";
	display: block;
	width: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	background: var(--white-color);
	mask: url("../image/common/icon_myqr.svg") no-repeat center / contain;
	-webkit-mask: url("../image/common/icon_myqr.svg") no-repeat center / contain;
}

.my_wrap .profile .right .my_pic {
	width: calc(100vw * (50 / var(--design-width)));
	height: calc(100vw * (50 / var(--design-width)));
	border-radius: var(--out-radius);
	overflow: hidden;
}

.my_wrap .profile_btn {
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 0;
	right: 0;
}

.my_wrap .profile_btn img {
	display: none;
}

.my_wrap .profile .right img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.my_wrap .qr_box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 calc(100vw * (10 / var(--design-width)));
	height: calc(100vw * (47 / var(--design-width)));
	background-color: #EBEBF1;
	box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.01);
	border-radius: var(--common-radius);
	margin-top: calc(100vw * (19 / var(--design-width)));
}

.my_wrap .qr_box .mail {
	font-weight: 600;
	font-size: calc(100vw * (15 / var(--design-width)));
	line-height: 1.35em;
	color: #4e4e4e;
}

.my_wrap .qr_box .qr_link {
	padding: 0 calc(100vw * (7 / var(--design-width)));
	height: calc(100vw * (35 / var(--design-width)));
	width: calc(100vw * (86 / var(--design-width)));
	background: #FFFFFF;
	border: 1px solid #DDDDDD;
	border-radius: var(--common-radius);
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.4em;
	color: var(--black-color);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.my_wrap .qr_box .qr_link img {
	width: calc(100vw * (18 / var(--design-width)));
}

.my_wrap .cash_box {
	width: 100%;
	padding: 0;
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.my_wrap .cash_box .cash_box_top {
	background-color: var(--white-color);
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	border-radius: var(--common-radius);
	box-shadow: var(--box-shadow);
	border: 1px solid var(--black-color);
}

.my_wrap .cash_box .title {
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
	text-align: center;
}

.my_wrap .cash_box .balance_wrap {
	font-size: calc(100vw * (36 / var(--design-width)));
	margin-top: calc(100vw * (10 / var(--design-width)));
	color: var(--black-color);
	text-align: center;
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

.my_wrap .cash_box .service_group {
	display: flex;
	align-items: center;
	border: 1px solid var(--border-color);
	border-radius: var(--common-radius);
}

.my_wrap .cash_box .service_group button {
	flex: 1;
	height: calc(100vw * (52 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	position: relative;
}

.my_wrap .cash_box .service_group button::before {
	content: "";
	display: block;
	width: 1px;
	height: calc(100vw * (14 / var(--design-width)));
	background: var(--border-color);
	position: absolute;
	left: 0;
}

.my_wrap .cash_box .service_group button:first-child::before {
	display: none;
}

.my_wrap .cash_box .usage_cate {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (12 / var(--design-width)));
	color: var(--black-color);
	margin-top: calc(100vw * (20 / var(--design-width)));
	padding-left: calc(100vw * (4 / var(--design-width)));
}

.my_wrap .cash_box .usage_cate .left,
.my_wrap .cash_box .usage_cate .right {
	flex: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.my_wrap .cash_box .usage_cate .c_num {
	font-weight: 600;
	font-size: calc(100vw * (13 / var(--design-width)));
	background: var(--box-bg-color);
	border-radius: var(--out-radius);
	padding: calc(100vw * (8 / var(--design-width))) calc(100vw * (12 / var(--design-width)));
	color: var(--black-color);
}

.my_wrap .cash_box .usage_cate .c_text {
	font-size: calc(100vw * (16 / var(--design-width)));
}

.my_wrap .point_box {
	margin-top: calc(100vw * (68 / var(--design-width)));
	height: auto;
	padding: calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	background: transparent;
	box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.12);
	border-radius: var(--common-radius);
	border: 1px solid var(--sub-color);
	background: #EDF7F8;
}

.my_wrap .point_box:before {
	content: "";
	width: 100vw;
	height: calc(100vw * (8 / var(--design-width)));
	background-color: var(--divide-color);
	position: absolute;
	top: calc(100vw * (-38 / var(--design-width)));
	left: calc(100vw * (-16 / var(--design-width)));
}

.my_wrap .point_box .p_title {
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.4em;
	color: var(--sub-color);
	padding-bottom: calc(100vw * (4 / var(--design-width)));
	border-bottom: 0;
}

.my_wrap .point_box .point_inbox {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 0;
}

.my_wrap .point_box .point_inbox .left {
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
	line-height: 1.25em;
	color: var(--sub-color);
}

.my_wrap .point_box .point_inbox .right {
	display: flex;
	gap: calc(100vw * (12 / var(--design-width)));
}

.my_wrap .point_box .point_inbox .p_btn {
	min-width: calc(100vw * (50 / var(--design-width)));
	min-height: calc(100vw * (32 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.25em;
	color: #FFFFFF;
	background: var(--sub-color);
	border-radius: var(--common-radius);
	padding: calc(100vw * (8 / var(--design-width))) calc(100vw * (13 / var(--design-width)));
}

.my_wrap .r_arw {
	width: calc(100vw * (6 / var(--design-width)));
	height: calc(100vw * (12 / var(--design-width)));
}

.my_wrap .my_list {
	margin-top: calc(100vw * (30 / var(--design-width)));
	padding: calc(100vw * (38 / var(--design-width))) 0 0;
	position: relative;
}

.my_wrap .my_list::before {
	content: "";
	display: block;
	background-color: var(--divide-color);
	width: 100vw;
	height: calc(100vw * (8 / var(--design-width)));
	position: absolute;
	top: 0;
	left: calc(100vw * (-16 / var(--design-width)));
}

.my_wrap .my_list .g_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--gray-color);
	margin-bottom: calc(100vw * (12 / var(--design-width)));
}

.my_wrap .list_my {
	display: flex;
	flex-direction: column;
}

.my_wrap .list_my .row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(100vw * (21 / var(--design-width))) 0;
}

.my_wrap .list_my .left {
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
	max-width: calc(100vw * (190 / var(--design-width)));
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.my_wrap .my_list.list2 .list_my .left {
	max-width: calc(100vw * (270 / var(--design-width)));
}

.my_wrap .list_my .right {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
	display: flex;
	align-items: center;
	gap: calc(100vw * (16 / var(--design-width)));
}

.my_wrap .list_my .right img {
	display: none;
}

.my_wrap .my_list:not(.list2) .list_my .right:after {
	content: "";
	width: calc(100vw * (7 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	background: var(--black-color);
	mask: url("../image/common/icon_quick.svg") no-repeat center / contain;
	-webkit-mask-: url("../image/common/icon_quick.svg") no-repeat center / contain;
	flex-shrink: 0;
}

.my_wrap .slide_btn {
	width: calc(100vw * (46 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	background-color: #D6D9E0;
	border-radius: var(--out-radius);
}

.my_wrap .slide_btn .btn_ball {
	width: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	background: #FFFFFF;
	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2);
	border-radius: var(--common-radius);
	transform: translateX(calc(100vw * (0 / var(--design-width))));
	transition: 0.5s;
}

.my_wrap .slide_btn.active {
	background-color: var(--main-color);
}

.my_wrap .slide_btn.active .btn_ball {
	transform: translateX(calc(100vw * (27 / var(--design-width))));
}

.my_wrap .logout_box {
	margin-top: 0;
	height: auto;
	width: 100%;
	background-color: transparent;
	border-radius: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: calc(100vw * (38 / var(--design-width)));
	margin: calc(100vw * (30 / var(--design-width))) 0 calc(100vw * (80 / var(--design-width)));
}

.my_wrap .logout_box .g_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--gray-color);
	width: 100%;
	margin-bottom: calc(100vw * (12 / var(--design-width)));
}

.my_wrap .logout_box:before {
	content: "";
	background-color: var(--divide-color);
	width: 100vw;
	height: calc(100vw * (8 / var(--design-width)));
	position: absolute;
	top: 0;
	left: calc(100vw * (-16 / var(--design-width)));
}

.my_wrap .logout_box a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(100vw * (21 / var(--design-width))) 0;
	flex: 1;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
	width: 100%;
}

.my_wrap .logout_box .logout {
	border-right: 0;
}

.my_wrap .logout_box .exit {
	padding-top: calc(100vw * (26 / var(--design-width)));
}

.my_new_list_title {
	margin: calc(100vw * (30 / var(--design-width))) 0 calc(100vw * (10 / var(--design-width)));
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	display: flex;
	align-items: center;
	color: var(--black-color);
}

.atm_find {
	margin-left: auto;
	color: var(--main-color);
	padding: calc(100vw * (6 / var(--design-width)));
	background: transparent;
	border-radius: var(--common-radius);
	font-size: calc(100vw * (12 / var(--design-width)));
	font-weight: 400;
	border: 1px solid var(--main-color);
}

/* my_new_list */
.my_new_list {
	display: flex;
	justify-content: center;
	gap: calc(100vw * (11 / var(--design-width)));
}

.my_new_list .my_new_btn {
	flex: 1;
	background: #fff;
	border-radius: var(--common-radius);
	display: flex;
	flex-direction: column;
	padding: calc(100vw * (15 / var(--design-width)));
	gap: calc(100vw * (13 / var(--design-width)));
	align-items: center;
	font-size: calc(100vw * (15 / var(--design-width)));
}

.my_new_list .my_new_btn img {
	width: calc(100vw * (25 / var(--design-width)));
}

.commonPopTitle .email_send_tit.del_tit {
	width: 100%;
	color: var(--caution-color);
}

/* mypage_kyc_state */
.mypage_kyc_state {
	width: 100%;
	display: flex;
	gap: calc(100vw * (12 / var(--design-width)));
	align-items: center;
	justify-content: space-between;
	margin-top: calc(100vw * (30 / var(--design-width)));
	background-color: var(--main-color);
	box-shadow: var(--box-shadow);
	padding: calc(100vw * (20 / var(--design-width)));
	border-radius: var(--common-radius);
}

.mypage_kyc_state .txt_area {
	color: #FFF;
	text-align: left;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.4;
	font-weight: 600;
}

.mypage_kyc_state .link_txt {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: calc(100vw * (8 / var(--design-width)));
	margin-top: calc(100vw * (12 / var(--design-width)));
}

.mypage_kyc_state .img_area {
	flex-shrink: 0;
	width: calc(100vw * (44 / var(--design-width)));
	aspect-ratio: 1/1;
}

.myqr_wrap {
	background-color: var(--background-color);
}

.myqr_box canvas {
	width: 100% !important;
}

/* qr_wrap */
.qr_wrap {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: calc(100vw * (20 / var(--design-width)));
	gap: calc(100vw * (40 / var(--design-width)));
	background: var(--white-color);
	margin: calc(100vw * (20 / var(--design-width)));
	border-radius: var(--out-radius);
}

.qr_wrap .myqr_box .logo_box {
	display: flex;
	justify-content: center;
	margin-bottom: calc(100vw * (16 / var(--design-width)));
}

.qr_wrap .myqr_box .logo_box img {
	height: calc(100vw * (18 / var(--design-width)));
}

.qr_wrap .myqr_box .qr_img {
	width: calc(100vw * (172 / var(--design-width)));
	height: calc(100vw * (172 / var(--design-width)));
	padding: calc(100vw * (12 / var(--design-width)));
	border-radius: var(--common-radius);
	background: var(--box-bg-color);
}

.qr_wrap .qr_profile {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
}

.qr_wrap .qr_profile .text {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--black-color);
}

.qr_wrap .qr_profile .text span {
	margin-right: calc(100vw * (2 / var(--design-width)));
}

.qr_wrap .qr_profile .btn_id_copy {
	display: flex;
	padding: calc(100vw * (4 / var(--design-width))) calc(100vw * (6 / var(--design-width)));
	justify-content: center;
	align-items: center;
	border-radius: var(--common-radius);
	background: var(--box-bg-color);
	font-size: calc(100vw * (12 / var(--design-width)));
	color: var(--gray-color);
	text-decoration: underline;
}

.qr_wrap .qr_text {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: calc(100vw * (12 / var(--design-width)));
	text-align: center;
}

.qr_wrap .qr_text .q_text1 {
	font-weight: 600;
	font-size: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
}

.qr_wrap .qr_text .q_text2 {
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.4;
	color: var(--gray-color);
}

/* remit_wrap */
.remit_wrap .common_charge_btn {
	display: flex;
	justify-content: flex-end;
}

.remit_wrap .common_charge_btn a {
	width: calc(100vw * (91 / var(--design-width)));
	margin-top: calc(100vw * (16 / var(--design-width)));
	display: inline-block;
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	padding: calc(100vw * (8 / var(--design-width))) 0;
	text-align: center;
	background: #EEEEEE;
	border-radius: var(--common-radius);
}

.remit_wrap .group_title {
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	color: #A2A2A9;
}

.remit_wrap * {
	position: relative;
}

.remit_wrap {
	background-color: var(--background-color);
	min-height: 100vh;
	flex-direction: column;
}

/* remit_inner */


.remit_inner .input_row {
	display: flex;
	background-color: #fff;
	margin-top: calc(100vw * (10 / var(--design-width)));
	max-width: 100%;
	height: calc(100vw * (62 / var(--design-width)));
	align-items: center;
	padding: 0 calc(100vw * (12 / var(--design-width)));
	color: var(--black-color);
	font-weight: 600;
	border: 1px solid var(--border-color);
	border-radius: var(--common-radius);
}

.remit_inner .input_row input {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	width: 100%;
}

.remit_inner .input_row input::placeholder {
	color: var(placeholder);
}

.remit_inner .input_row.row1 .number {
	display: block;
	text-align: right;
	margin-left: auto;
	min-width: calc(100vw * (175 / var(--design-width)));
	padding-left: calc(100vw * (5 / var(--design-width)));
}

.remit_inner .title_group {
	margin-top: calc(100vw * (40 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: calc(100vw * (24 / var(--design-width)));
}

.remit_inner .reset img {
	width: calc(100vw * (12 / var(--design-width)));
}

.remit_inner .dropdown_bank {
	width: 100%;
	display: flex;
}

.remit_inner .input_row.dropdown_bank_wrap {
	padding: calc(100vw * (6 / var(--design-width))) 0;
	background-color: unset;
	margin-top: calc(100vw * (20 / var(--design-width)));
	border-radius: 0;
	color: var(--black-color);
	font-weight: 600;
	border: 0;
	height: auto;
}

.remit_inner .select_trigger {
	display: flex;
	flex: 1;
	align-items: center;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
	gap: calc(100vw * (5 / var(--design-width)));
}

.remit_inner .select_trigger .select_trigger_icon {
	width: calc(100vw * (28 / var(--design-width)));
	height: calc(100vw * (28 / var(--design-width)));
}

/* remittance_chk_btn */
.remittance_chk_btn {
	background: #fff;
	border: calc(100vw * (2 / var(--design-width))) solid var(--main-color);
	margin-top: calc(100vw * (10 / var(--design-width)));
	color: var(--main-color);
}

.remittance_chk_btn.unable {
	background: #EFF4F6;
	border-color: #EFF4F6;
	color: var(--main-color);
	gap: calc(100vw * (8 / var(--design-width)));
}

.remittance_chk_btn.unable:before {
	content: "";
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	background-image: url("../image/sub/remittance_chk.png");
	background-size: 100%;
}

/* remit_inner */
.remit_inner .select_trigger .bank {
	width: calc(100vw * (28 / var(--design-width)));
}

.remit_inner .select_trigger .arrow {
	width: calc(100vw * (14 / var(--design-width)));
	margin-left: auto;
}

.remit_inner .remit2 .row1 {
	display: flex;
	justify-content: space-between;
	border-radius: 12px;
	border: calc(100vw * (1 / var(--design-width))) solid #DEE6E9;
	background: #EFF4F6;
}


.remit_inner .remit2 .row2 {
	height: calc(100vw * (68 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (24 / var(--design-width)));
	line-height: 1.2;
	color: var(--black-color);
	margin-top: calc(100vw * (24 / var(--design-width)));
}

.remit_inner .remit2 .row2 .dropdown_point {
	display: flex;
	justify-content: space-between;
	width: 100%;
	align-items: center;
}

.remit_inner .remit2 .row2 .dropdown_point input {
	max-width: 90%;
}

.remit_inner .remit2 .row2 .dropdown_point img {
	width: calc(100vw * (14 / var(--design-width)));
}

.remit_inner .remit_bar {
	width: 100vw;
	height: calc(100vw * (8 / var(--design-width)));
	background: var(--divide-color);
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (-20 / var(--design-width))) 0;
}

.remit_inner .group_end {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	margin-top: calc(100vw * (20 / var(--design-width)));
}



.remit_inner .flex_s {
	width: 100%;
}

.remit_inner .remit3 .row1 {
	height: auto;
	flex-direction: column;
	justify-content: center;
	gap: unset;
	padding: unset;
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	padding: calc(100vw * (20 / var(--design-width)));
	border: unset;
	overflow: hidden;
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
}

.remit_inner .remit3 .row1 .total {
	font-size: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
}

.remit_inner .remit3 .row1 .total .bold {
	font-weight: 600;
}

.remit_inner .remit3 .row {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.remit_inner .remit3 .row span:nth-child(1) {
	color: var(--gray-color);
	font-weight: 400;
}

.remit_inner .remit3 .r1 {
	padding-bottom: calc(100vw * (20 / var(--design-width)));
}

.remit_inner .remit3 .r2 {
	padding-bottom: calc(100vw * (20 / var(--design-width)));
}

.remit_inner .remit3 .r3 {
	padding-top: calc(100vw * (15 / var(--design-width)));
	border-top: calc(100vw * (1 / var(--design-width))) solid var(--border-color);
}

.remit_inner .remit3 .r3 .bold {
	font-weight: 600;
	color: var(--main-color);
}
#remittance_totalpoint .unit {
	color: var(--main-color);
}
.remit_inner .dropdown.remit {
	position: absolute;
	min-width: calc(100vw * (120 / var(--design-width)));
	height: calc(100vw * (200 / var(--design-width)));
	top: calc(100vw * (58 / var(--design-width)));
	left: 0px;
	z-index: 22;
	background-color: rgb(210, 210, 210);
	overflow-y: auto;
	border-radius: var(--common-radius);
	display: none;
}

.remit_inner .input_group.remit3 {
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

.remit_inner .dropdown.remit img {
	width: calc(100vw * (28 / var(--design-width)));
	display: block;
	margin-right: calc(100vw * (6 / var(--design-width)));
}

.remit_inner .dropdown.remit li {
	list-style: none;
	padding: calc(100vw * (6 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
	display: flex;
	align-items: center;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
}

.remit_inner .btn_remit {
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	color: var(--unable-color);
	width: 100%;
	margin: calc(100vw * (60 / var(--design-width))) 0 calc(100vw * (30 / var(--design-width)));
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
}

.remit_inner .btn_remit.active {
	background-color: var(--main-color);
	color: #FFF;
}

.charge_notice {
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
}

/* remit_inner */
.remit_inner .charge_notice .row1 {
	margin-bottom: calc(100vw * (12 / var(--design-width)));
}

.remit_inner .charge_notice a {
	font-weight: 600;
}

/* charge_notice */
.charge_notice .row1 span {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2;
	color: var(--black-color);
}

.charge_notice .row2 span {
	display: block;
	padding-left: calc((100vw * (20 / var(--design-width))));
	margin-bottom: calc(100vw * (8 / var(--design-width)));
	line-height: 1.4;
	position: relative;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.charge_notice .row2 span:before {
	content: "";
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	background-color: var(--black-color);
	border-radius: 100%;
	position: absolute;
	left: calc(100vw * (8 / var(--design-width)));
	top: calc(100vw * (8 / var(--design-width)));
}

.remit_wrap .group_title,
.charge_wrap .grid_title {
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
	color: var(--black-color);
}

.remit_inner .reset {
	display: flex;
	gap: calc(100vw * (4 / var(--design-width)));
	align-items: center;
	font-size: calc(100vw * (12 / var(--design-width)));
}

/* bank_up */
.bank_up {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	transform: translateY(100%);
	transition: 0.5s;
	z-index: 1000;
}

.bank_up.on {
	transform: translateY(0);
}

.bank_up .bg {
	width: 100%;
	height: 260vh;
	background: #000000;
	opacity: 0.5;
	position: absolute;
	top: 0;
	left: 0;
	top: -200%;
	display: none;
}

/* up_box */
.up_box {
	margin-top: auto;
	padding: 0 calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background-color: #fff;
	border-radius: var(--out-radius) var(--out-radius) 0 0;
	position: relative;
	display: flex;
	flex-direction: column;
	max-height: 90vh;
	overflow: hidden;
	overflow-y: auto;
}

.up_box .u_title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.25em;
}

.up_box .scroll_inner {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	flex: 1;
	overflow-x: hidden;
}

.up_box .point_grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: calc(100vw * (6 / var(--design-width)));
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.up_box .u_sub {
	margin-top: calc(100vw * (8 / var(--design-width)));
}

.up_box .point_grid .p_num {
	height: calc(100vw * (66 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	gap: calc(100vw * (2 / var(--design-width)));
}
.up_box .point_grid .p_num .amount{
	font-weight: 600;
	display: flex;
	flex-direction: row-reverse;
	gap: calc(100vw * (3 / var(--design-width)));
}

.up_box .point_grid .p_num:before {
	content: "+";
}

.up_box .point_grid.card_num .p_num:before {
	display: none;
}

.bank_up.point .up_box .point_grid .p_num:before {
	display: none;
}

/* up_box */
.up_box .point_grid .p_btn.active,
.up_box .point_grid .p_num.active {
	background: #DDF3F1;
}

.up_box .point_grid.card_num .p_num.active,
.bank_up.point .up_box .point_grid .p_num.active {
	background: #FFF;
	color: var(--main-color);
	border: calc(100vw * (2 / var(--design-width))) solid var(--main-color);
}

.up_box .point_grid .p_num .count {
	position: absolute;
	width: calc(100vw * (22 / var(--design-width)));
	height: calc(100vw * (22 / var(--design-width)));
	border-radius: 50%;
	background-color: var(--gray-color);
	border: 2px solid #fff;
	text-align: center;
	top: -10%;
	right: -10%;
	font-size: calc(100vw * (12 / var(--design-width)));
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	z-index: 3;
}



.up_box .modal_btn_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
}




.up_box .charge_tit {
	color: var(--grey, var(--grey, #737981));
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	margin-top: calc(100vw * (30 / var(--design-width)));
}

/* total_value */
.total_value {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: calc(100vw * (6 / var(--design-width)));
	font-size: calc(100vw * (18 / var(--design-width)));
	margin: calc(100vw * (10 / var(--design-width))) 0 calc(100vw * (40 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	padding: calc(100vw * (13 / var(--design-width))) 0;
	background: transparent;
	border-bottom: 2px solid var(--main-color);
	color: var(--black-color);
	font-weight: 600;
}

.total_value span {
	font-size: calc(100vw * (34 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
}

.total_value span#charge_amount_currency_txt {
	font-size: calc(100vw * (30 / var(--design-width)));
	font-weight: 400;
	letter-spacing: calc(100vw * (-1.2 / var(--design-width)));
}

.total_value span#charge_amount_currency_txt .unit {
	font: inherit;
}

.up_box .point_grid .p_btn {
	grid-column: span 3;
	width: 100%;
	height: calc(100vw * (54 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	margin-top: calc(100vw * (22 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
}

/* bank_up */
.bank_up.point {
}

.bank_up.point .up_box {
	padding: 0 0 calc(100vw * (20 / var(--design-width)));
}

.bank_up.point .up_box .u_title {
	padding: 0 calc(100vw * (20 / var(--design-width))) 0;
	align-items: flex-start;
}

.bank_up.point .up_box .scroll_inner {
	padding: 0 calc(100vw * (20 / var(--design-width))) 0;
}

.bank_up .p_bank {
	display: flex;
	flex-direction: column;
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	align-items: center;
	justify-content: center;
	gap: calc(100vw * (10 / var(--design-width)));
	text-align: center;
}

.bank_up .p_bank img {
	width: calc(100vw * (28 / var(--design-width)));
}

.bank_up.bank .up_box .point_grid {
	grid-template-columns: repeat(3, 1fr);
	row-gap: calc(100vw * (20 / var(--design-width)));
	column-gap: unset;
	max-height: 60vh;
	overflow-y: auto;
	padding-bottom: calc(100vw * (30 / var(--design-width)));
}

.common_wrap {
	background-color: var(--background-color);
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	padding-top: calc(100vw * (50 / var(--design-width)));
}

.list_wrap {
	padding: 0 calc(100vw * (16 / var(--design-width)));
	width: 100%;
	height: auto;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	flex: 1;
}

/* history_box */
.history_box {
	padding: calc(100vw * (20 / var(--design-width))) 0;
}

.history_box.plus {
	background-color: #095F65;
	left: 0;
	transition: 0.5s;
}

.history_box_header {
	padding: 0 calc(100vw * (16 / var(--design-width)));
}

.box_title {
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: normal;
}

/* history_box */
.history_box .h_cash {
	font-weight: 600;
	font-size: calc(100vw * (32 / var(--design-width)));
	line-height: 1.35em;
	margin-top: calc(100vw * (10 / var(--design-width)));
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
}



.history_box .btn_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (20 / var(--design-width)));
	margin-top: calc(100vw * (16 / var(--design-width)));
	padding: 0 calc(100vw * (20 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

.history_box .btn_group .h_btn {
	text-align: center;
	font-size: calc(100vw * (16 / var(--design-width)));
	min-height: calc(100vw * (50 / var(--design-width)));
	font-weight: 600;
	border-bottom: 2px solid transparent;
	position: relative;
	bottom: calc(100vw * (-1 / var(--design-width)));
}

.history_box .btn_group .h_btn[data-value="use"].active,
.history_box .btn_group .h_btn[data-value="charge"].active {
	color: var(--main-color);
	border-bottom: 2px solid var(--main-color);
}

.history_box .btn_group .h_btn[data-value="use"],
.history_box .btn_group .h_btn[data-value="charge"] {
	color: var(--gray-color);
}

.history_box.plus .btn_group .h_btn[data-value="use"].active,
.history_box.plus .btn_group .h_btn[data-value="charge"].active {
	background-color: #25A0A8;
	color: #fff;
}

.history_box.plus .btn_group .h_btn[data-value="use"],
.history_box.plus .btn_group .h_btn[data-value="charge"] {
	background-color: #186D73;
	color: #92C8CB;
}

/* list_switch */
.list_switch {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (25 / var(--design-width))) 0;
	border-bottom: 1px solid #EAEBEC;
	box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.01);
	display: flex;
	gap: calc(100vw * (27 / var(--design-width)));
}

.list_switch a {
	padding-bottom: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (17 / var(--design-width)));
	color: var(--black-color);
}

.list_switch a.active {
	color: #59A8C8;
	border-bottom: 3px solid #59A8C8;
	box-sizing: border-box;
}

/* list_wrap */
.list_wrap .history_title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(100vw * (15 / var(--design-width))) 0 calc(100vw * (23 / var(--design-width)));
}

.list_wrap .history_title::after {
	content: "";
	display: block;
	width: 100vw;
	height: calc(100vw * (8 / var(--design-width)));
	background: var(--divide-color);
	position: absolute;
	bottom: calc(100vw * (0 / var(--design-width)));
	left: calc(100vw * (-16 / var(--design-width)));
}

.list_wrap .history_title .h_num {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
}

.list_wrap .history_title .h_num span {
	font-weight: 600;
	color: var(--black-color);
}

.list_wrap .history_title .h_filter {
	display: flex;
	align-items: center;
	gap: calc(100vw * (4 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	color: #4F5156;
}

.list_wrap .history_title .h_filter img {
	width: calc(100vw * (12 / var(--design-width)));
}

.list_wrap .h_list_group {
	display: flex;
	flex: 1;
	flex-direction: column;
}

.list_wrap .h_list_group .h_list {
	display: flex;
	align-items: flex-start;
	padding: calc(100vw * (30 / var(--design-width))) 0;
	border-bottom: 1px solid var(--border-color);
}

/* slide_img_box */
.slide_img_box,
.list_wrap .h_list_group .h_list .img_box {
	background: #D6D9E0;
	border-radius: var(--common-radius);
	width: calc(100vw * (45 / var(--design-width)));
	height: calc(100vw * (45 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: calc(100vw * (11 / var(--design-width)));
}

.slide_img_box,
.list_wrap .h_list_group .h_list .img_box.img_box_none {
	display: none;
}

.slide_img_box img,
.list_wrap .h_list_group .h_list .img_box img {
	width: calc(100vw * (14 / var(--design-width)));
}

/* list_wrap */
.list_wrap .h_list_group .h_list .list_text {
	font-weight: 600;
	font-size: calc(100vw * (17 / var(--design-width)));
	line-height: 1.2;
	color: var(--black-color);
	max-width: calc(100vw * (180 / var(--design-width)));
}

.list_wrap .h_list_group .h_list .list_cash {
	margin-left: auto;
	text-align: right;
	font-weight: 600;
	font-size: calc(100vw * (17 / var(--design-width)));
	line-height: 1.45;
	text-align: right;
	color: var(--black-color);
}

.list_wrap .h_list_group .h_list .list_cash .l_cash {
	letter-spacing: calc(100vw * (-0.68 / var(--design-width)));
}

.list_wrap .h_list_group .h_list .l_text {
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: normal;
	color: var(--gray-color);
	margin-top: calc(100vw * (3 / var(--design-width)));
}

.list_wrap .h_list_group .h_list .l_text.l_state {
	margin-top: calc(100vw * (10 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--black-color);
}

.list_wrap .h_list_group .h_list .list_cash .l_text {
	margin-top: calc(100vw * (8 / var(--design-width)));
}

.gift_wrap {
	width: 100%;
	min-height: calc(100vh - calc(100vw * (60 / var(--design-width))));
	display: flex;
	flex-direction: column;
	padding: calc(100vw * (50 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
}

/* gift_fee_info */
.gift_fee_info {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	margin-top: calc(100vw * (6 / var(--design-width)));
	margin-bottom: calc(100vw * (46 / var(--design-width)));
	color: var(--gray-color);
}

.gift_fee_info span {
	color: var(--caution-color);
	font-weight: 400;
}

/* giftshop_wrap */
.giftshop_wrap .g_title,
.gift_wrap .g_title {
	font-weight: 600;
	font-size: calc(100vw * (28 / var(--design-width)));
	line-height: 1.4em;
	color: var(--black-color);
}

.giftshop_wrap .g_title p {
	margin-bottom: calc(100vw * (8 / var(--design-width)));
}

.giftshop_wrap .popup-image-area {
	flex: 1;
}

/* gift_wrap */
.gift_wrap .gift_box {
	margin-bottom: calc(100vw * (18 / var(--design-width)));
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (18 / var(--design-width)));
	background: #FFF;
	border-radius: var(--common-radius);
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
	gap: calc(100vw * (16 / var(--design-width)));
	box-shadow: var(--btn-shadow);
}

.gift_wrap .gift_box .g_left {
	flex: 0 0 auto;
}

.gift_wrap .gift_box .g_right {
	flex: 1;
}

.gift_wrap .gift_box input {
	display: none;
}

.gift_wrap .gift_box .g_text {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
}

.gift_wrap .gift_box .g_tit {
	font-weight: 400;
	font-size: calc(100vw * (15 / var(--design-width)));
	line-height: 1.3;
	color: var(--gray-color);
	margin-top: calc(100vw * (4 / var(--design-width)));
}

.gift_wrap .gift_box img {
	width: calc(100vw * (50 / var(--design-width)));
}

/* gift_agree_modal */
.gift_agree_modal.on {
	transform: translateY(0);
}

.gift_agree_modal .c_notice {
	margin-top: 0;
	border-top: 0;
}

.gift_agree_modal .c_notice .c_ntit {
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.6em;
	color: var(--black-color);
	letter-spacing: -0.05em;
}

.gift_agree_modal .c_notice .c_ntit span {
	display: block;
	padding-left: calc((100vw * (20 / var(--design-width))));
	margin-bottom: calc(100vw * (5 / var(--design-width)));
	line-height: 1.4;
	position: relative;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.gift_agree_modal .c_notice .c_ntit span:before {
	content: "";
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	background-color: var(--black-color);
	border-radius: 100%;
	position: absolute;
	left: calc(100vw * (8 / var(--design-width)));
	top: calc(100vw * (10 / var(--design-width)));
}

.gift_agree_modal .btn_area {
	display: flex;
	gap: calc(100vw * (6 / var(--design-width)));
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.gift_agree_modal .btn_area .com_btn {
	margin-bottom: 0;
	flex: 2;
}

.gift_agree_modal .btn_area .com_btn.gray {
	background: transparent;
	border: calc(100vw * (1 / var(--design-width))) solid #DEE6E9;
	color: #1D2123;
	flex: 1;
}

/* send_wrap */
.send_wrap {
	width: 100%;
	height: calc(100dvh - calc(100vw * (60 / var(--design-width))));
	display: flex;
	flex-direction: column;
	padding: 0 calc(100vw * (16 / var(--design-width))) 0;
}

.send_wrap .send_box {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	position: relative;
	margin-top: calc(100vw * (12 / var(--design-width)))
}

.send_wrap .box_title {
	font-weight: 400;
	color: var(--black-color);
}

.send_wrap .s_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 0;
	border-bottom: 0;
	margin-top: calc(100vw * (8 / var(--design-width)));
	position: unset;
}

.send_wrap .s_cash {
	font-weight: 600;
	font-size: calc(100vw * (22 / var(--design-width)));
	line-height: normal;
	display: flex;
	align-items: center;
}

.send_wrap .s_cash span {
	font-size: calc(100vw * (28 / var(--design-width)));
	letter-spacing: calc(100vw * (-1.04 / var(--design-width)));
}

.send_wrap .s_btn {
	padding: 0;
	text-align: center;
	background-color: transparent;
	border-radius: var(--common-radius);
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	position: absolute;
	top: calc(100vw * (20 / var(--design-width)));
	right: calc(100vw * (16 / var(--design-width)));
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	color: var(--main-color);
}

.send_wrap .s_btn:after {
	content: "";
	width: calc(100vw * (7 / var(--design-width)));
	height: calc(100vw * (12 / var(--design-width)));
	background: var(--main-color);
	mask: url("../image/common/icon_quick.svg") no-repeat center / contain;
	-webkit-mask-: url("../image/common/icon_quick.svg") no-repeat center / contain;
	flex-shrink: 0;
}

.send_wrap .s_input_group {
	margin-top: calc(100vw * (22 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
}

.send_wrap .input_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--gray-color);
}

.send_wrap .s_input input {
	margin-top: calc(100vw * (8 / var(--design-width)));
	padding: 0 calc(100vw * (6 / var(--design-width)));
	width: 100%;
	height: calc(100vw * (62 / var(--design-width)));
	display: flex;
	align-items: center;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

.send_wrap .s_input input::placeholder {
	color: var(--placeholder);
	font-weight: 400;
	font-size: calc(100vw * (18 / var(--design-width)));
}

.send_wrap .s_input_amount input {
	font-size: calc(100vw * (34 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	text-align: right;
	min-width: 0;
	flex: 1;
}
.amount_insert_box {
	display: flex;
	align-items: center;
	margin-top: calc(100vw * (10 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
	height: calc(100vw * (62 / var(--design-width)));
}


.amount_insert_box .unit {
	flex-shrink: 0;
	font-size: calc(100vw * (34 / var(--design-width)));
	margin-left: calc(100vw * (4 / var(--design-width)));
	display: none;
}
.amount_insert_box:has(input:focus) {
	border-bottom: 2px solid var(--main-color);
}
.amount_insert_box:has(input:focus),
.amount_insert_box:has(input:not(:placeholder-shown)) {
	border-bottom: 2px solid var(--main-color);
}
.amount_insert_box input:focus ~ .unit,
.amount_insert_box:has(input:not(:placeholder-shown)) .unit {
	display: block;
}




.send_wrap .com_btn {
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	flex-shrink: 0;
}

/* c_charge_wrap */
.c_charge_wrap .c_hbtn {
	width: calc(100vw * (91 / var(--design-width)));
	margin-top: calc(100vw * (16 / var(--design-width)));
	display: inline-block;
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	padding: calc(100vw * (8 / var(--design-width))) 0;
	text-align: center;
	border-radius: var(--common-radius);
	background: var(--main-color);
	margin-left: auto;
	color: #FFF;
}

.c_charge_wrap .c_btn_list {
	margin-top: calc(100vw * (17 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (12 / var(--design-width)));
	margin-bottom: calc(100vw * (46 / var(--design-width)));
}

.c_charge_wrap .c_btn {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (22 / var(--design-width)));
	background: #FFFFFF;
	box-shadow: 2px 3px 8px -2px rgba(101, 113, 131, 0.15);
	border-radius: var(--common-radius);
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 600;
	font-size: calc(100vw * (19 / var(--design-width)));
	line-height: 1.4em;
	color: var(--black-color);
}

.c_charge_wrap .c_btn img {
	width: calc(100vw * (36 / var(--design-width)));
}

.c_charge_wrap .charge_notice .row3 {
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: normal;
	color: var(--main-color);
	margin-top: calc(100vw * (20 / var(--design-width)));
}

/* giftshop_wrap */
.giftshop_wrap {
	width: 100%;
	min-height: calc(100vh - calc(100vw * (60 / var(--design-width))));
	display: flex;
	flex-direction: column;
	padding: calc(100vw * (60 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	overflow-y: auto;
}

.giftshop_wrap img {
	margin-top: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (300 / var(--design-width)));
}

.giftshop_wrap .com_btn {
	flex-shrink: 0;
}

.giftshop_wrap .ect {
	width: 80%;
	position: absolute;
	top: 33%;
	left: 50%;
	transform: translate(-50%, -50%);
	animation: up_down 1.5s ease-in-out infinite alternate;
}

@keyframes up_down {
	0% {
		transform: translate(-50%, -50%);
	}

	100% {
		transform: translate(-50%, -40%);
	}
}

/* card_wrap */
.card_wrap {
	width: 100%;
	display: flex;
	flex-direction: column;
	padding: calc(100vw * (64 / var(--design-width))) 0 0;
}

.card_wrap.full {
	height: auto;
	padding: 0 calc(100vw * (16 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
}

.card_wrap.ok {
	padding: 0 calc(100vw * (16 / var(--design-width)));
	align-items: center;
	height: calc(100vh - (100vw * (50 / var(--design-width))));
}

.card_switch {
	display: flex;
	justify-content: flex-start;
	text-align: center;
	gap: calc(100vw * (24 / var(--design-width)));
	overflow-x: auto;
	width: 100%;
	height: calc(100vw * (65 / var(--design-width)));
	position: fixed;
	top: calc(100vw * (50 / var(--design-width)));
	left: 0;
	padding: 0 calc(100vw * (24 / var(--design-width)));
	background-color: var(--background-color);
	z-index: 10;
	border-bottom: 1px solid var(--border-color);
}

.card_wrap.lost_wrap {
	padding: calc(100vw * (65 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (38 / var(--design-width)));
	flex: 1;
}

.lost_top_group {
	display: flex;
	gap: calc(100vw * (30 / var(--design-width)));
	align-items: center;
	margin-top: calc(100vw * (20 / var(--design-width)));
}

/* lost_date_box */
.lost_date_box {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 1;
	gap: calc(100vw * (4 / var(--design-width)));
	position: relative;
}

.lost_date_box::after {
	content: "";
	display: block;
	width: 100vw;
	height: calc(100vw * (8 / var(--design-width)));
	background: var(--divide-color);
	position: absolute;
	bottom: calc(100vw * (-20 / var(--design-width)));
	left: calc(100vw * (-16 / var(--design-width)));
}

.lost_date_icon {
	width: calc(100vw * (20 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
}

.lost_date_arw {
	width: calc(100vw * (21 / var(--design-width)));
}

.lost_date input[type="text"] {
	font-size: calc(100vw * (14 / var(--design-width)));
	text-align: center;
	background: transparent;
	color: var(--gray-color);
	width: calc(100vw * (174 / var(--design-width)));
	min-width: 0;
}

/* card_switch */
.card_switch .switch {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: normal;
	color: var(--gray-color);
	width: max-content;
	height: 100%;
	display: flex;
	flex: 0 0 auto;
	align-items: center;
}

.card_switch .switch.active {
	color: var(--main-color);
	border-bottom: calc(100vw * (2 / var(--design-width))) solid var(--main-color);
	opacity: 1;
}

/* card_guide_img_box */
.card_guide_img_box {
	width: 100vw;
}

.card_guide_img_box .carg_guide_top {
	background-image: url("../image/sub/card_guide_top_bg.png");
	background-size: cover;
	display: flex;
	flex-direction: column;
	padding-top: calc(100vw * (50 / var(--design-width)));
	gap: calc(100vw * (27 / var(--design-width)));
}

.card_guide_img_box .carg_guide_top .carg_guide_top_txt {
	color: #fff;
	text-align: center;
}

.card_guide_img_box .carg_guide_top .carg_guide_top_txt .logo_img {
	width: calc(100vw * (98 / var(--design-width)));
	margin: 0 auto;
}

.card_guide_img_box .carg_guide_top .carg_guide_top_txt .title {
	color: var(--white, #FFF);
	text-align: center;
	font-size: calc(100vw * (29 / var(--design-width)));
	font-weight: 600;
	padding: 0 calc(100vw * (20 / var(--design-width)));
	margin: calc(100vw * (11 / var(--design-width))) auto calc(100vw * (24 / var(--design-width)));
	line-height: normal;
}

.card_guide_img_box .carg_guide_top .carg_guide_top_txt .sub_tit {
	opacity: 0.8;
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 400;
	line-height: 1.35;
	letter-spacing: calc(100vw * (-0.6 / var(--design-width)));
}

.card_guide_img_box .carg_guide_top .carg_guide_top_img {
	width: calc(100vw * (325 / var(--design-width)));
	margin: 0 auto calc(100vw * (-47 / var(--design-width)));
}

.card_guide_img_box .card_guide_contents {
	padding: calc(100vw * (60 / var(--design-width))) calc(100vw * (30 / var(--design-width))) calc(100vw * (66 / var(--design-width)));
}

.card_guide_img_box .card_guide_contents .card_guide_contents_tit {
	text-align: center;
	font-size: calc(100vw * (28 / var(--design-width)));
	font-weight: 600;
	margin: 0 auto calc(100vw * (50 / var(--design-width)));
	padding: 0 calc(100vw * (20 / var(--design-width)));
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (50 / var(--design-width)));
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items {
	background-color: #f4f4f9;
	border-radius: var(--out-radius);
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items .main_txt {
	color: #2D2D2D;
	text-align: center;
	font-size: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: calc(100vw * (-0.48 / var(--design-width)));
	margin: calc(100vw * (50 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items .sub_txt {
	color: #464646;
	text-align: center;
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: calc(100vw * (-0.42 / var(--design-width)));
	margin: 0 calc(100vw * (20 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items .img {
	margin-bottom: calc(100vw * (-46 / var(--design-width)));
	display: flex;
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items.items3 .img {
	width: calc(100vw * (256 / var(--design-width)));
	margin: calc(100vw * (60 / var(--design-width))) auto calc(100vw * (115 / var(--design-width)));
	box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.12);
	border-radius: var(--common-radius);
	position: relative;
	z-index: 0;
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items.items3 .img::before {
	content: "";
	width: calc(100vw * (103 / var(--design-width)));
	height: calc(100vw * (114 / var(--design-width)));
	background-image: url("../image/sub/card_guide_item03-1.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	position: absolute;
	top: calc(100vw * (-85 / var(--design-width)));
	right: calc(100vw * (-30 / var(--design-width)));
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items.items3 .img::after {
	content: "";
	width: calc(100vw * (122 / var(--design-width)));
	height: calc(100vw * (157 / var(--design-width)));
	background-image: url("../image/sub/card_guide_item03-2.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	position: absolute;
	bottom: calc(100vw * (-85 / var(--design-width)));
	left: calc(100vw * (-30 / var(--design-width)));
	z-index: -1;
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items.items4 .img {
	width: calc(100vw * (256 / var(--design-width)));
	margin: calc(100vw * (75 / var(--design-width))) auto calc(100vw * (96 / var(--design-width)));
	border-radius: var(--common-radius);
	position: relative;
	z-index: 0;
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items.items4 .img::before {
	content: "";
	width: calc(100vw * (149 / var(--design-width)));
	height: calc(100vw * (122 / var(--design-width)));
	background-image: url("../image/sub/card_guide_item04-1.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	position: absolute;
	top: calc(100vw * (-80 / var(--design-width)));
	right: calc(100vw * (-21 / var(--design-width)));
}

.card_guide_img_box .card_guide_contents .card_guide_contents_box .card_guide_contents_items.items4 .img::after {
	content: "";
	width: calc(100vw * (120 / var(--design-width)));
	height: calc(100vw * (106 / var(--design-width)));
	background-image: url("../image/sub/card_guide_item04-2.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	position: absolute;
	bottom: calc(100vw * (-82 / var(--design-width)));
	left: calc(100vw * (39 / var(--design-width)));
	z-index: -1;
}

.card_wrap .c_empty {
	position: relative;
	background: var(--box-bg-color);
	padding: calc(100vw * (52 / var(--design-width))) 0;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.card_title {
	color: var(--black-color);
	font-size: calc(100vw * (26 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.card_subtitle {
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.4;
	text-align: center;
	margin-top: calc(100vw * (6 / var(--design-width)));
}

@keyframes card_reg {
	0% {
		top: -8%;
	}

	10% {
		top: -10%;
	}

	20% {
		top: -8%;
	}

	30% {
		top: -10%;
	}

	40% {
		top: -8%;
	}

	100% {
		top: -8%;
	}
}

/* card_wrap */
.card_wrap .c_notice {
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
}

.card_wrap .c_notice.lost {
	margin: calc(100vw * (30 / var(--design-width))) 0 calc(100vw * (30 / var(--design-width)));
}

.card_wrap .c_notice .c_ntitle {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2;
	color: var(--black-color);
}

.c_notice .c_ntitle:not(:first-of-type) {
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.card_wrap .c_notice .c_ntit.span {
	margin-top: calc(100vw * (10 / var(--design-width)));
	line-height: unset;
}

.goto_inquiry {
	display: inline;
	vertical-align: unset;
}

/* card_wrap */
.card_wrap .c_notice .c_ntit span {
	display: block;
	padding-left: calc((100vw * (20 / var(--design-width))));
	margin-bottom: calc(100vw * (5 / var(--design-width)));
	line-height: 1.4;
	position: relative;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.card_wrap .c_notice .c_ntit span:before {
	content: "";
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	background-color: var(--black-color);
	border-radius: 100%;
	position: absolute;
	left: calc(100vw * (8 / var(--design-width)));
	top: calc(100vw * (8 / var(--design-width)));
}

.card_wrap .c_notice .c_ntit span:last-child {
	margin-bottom: 0;
}

.card_wrap .c_card_box {
	width: 100%;
	padding: calc(100vw * (40 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background: var(--box-bg-color);
	border-radius: var(--out-radius);
	margin-top: calc(100vw * (12 / var(--design-width)));
}

.card_wrap .c_card_box .c_card_text {
	margin-bottom: calc(100vw * (8 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.4;
	color: var(--black-color);
}

.card_wrap .c_card_box.ok .c_card_text .title {
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
	font-weight: 600;
	margin: calc(100vw * (10 / var(--design-width))) 0 calc(100vw * (6 / var(--design-width)));
}

.card_wrap .c_card_box.ok .c_card_text .desc {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	font-weight: 400;
	line-height: 1.4;
}

.card_wrap .c_card_box .c_sub_text {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.4;
	color: var(--gray-color);
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

/* c_card_box */
.c_card_box .d-card {
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.c_card_box .d-card img {
	width: calc(100vw * (190 / var(--design-width)));
}

/* p-card */
.p-card {
	width: calc(100vw * (120 / var(--design-width)));
	height: calc(100vw * (190 / var(--design-width)));
	border-radius: var(--common-radius);
	overflow: hidden;
	box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.25);
}

.p-card img {
}

.c_index {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
	margin-top: calc(100vw * (40 / var(--design-width)));
}

/* card_wrap */
.card_wrap .c_row_group {
	margin-top: calc(100vw * (28 / var(--design-width)));
	display: flex;
	flex-direction: column;
}

.card_wrap .c_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: calc(100vw * (12 / var(--design-width)));
}

.card_wrap .c_row.c_row--item {
	margin-bottom: 0;
}

.card_wrap .c_row .c_sub {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--gray-color);
	font-weight: 400;
}

.card_wrap .c_row .img {
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
	color: var(--gray-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
}

.card_wrap .c_row img {
	width: calc(100vw * (20 / var(--design-width)));
}

.card_wrap .card_row.input {
	background: #FFF;
	border-bottom: 1px solid var(--border-color);
	color: var(--black-color);
	font-weight: 600;
}

.card_wrap .card_row.input::placeholder {
	color: var(--placeholder);
	font-weight: 400;
}

.card_wrap .card_row.input:focus {
	border-color: var(--main-color);
}

.card_wrap .card_row {
	padding: 0 calc(100vw * (12 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
	display: flex;
	align-items: center;
	background: var(--box-bg-color);
	margin-bottom: calc(100vw * (8 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

.card_wrap .card_row input {
	background: inherit !important;
	width: 100%;
	color: var(--black-color);
	font-weight: 600;
}

.card_wrap .c_under {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.4;
	color: var(--gray-color);
	text-align: center;
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.com_btn_group {
	margin-top: calc(100vw * (30 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	display: flex;
	gap: calc(100vw * (10 / var(--design-width)));
	width: 100%;
}

/* card_wrap */


.card_wrap .c_pop {
	width: calc(100vw * (260 / var(--design-width)));
	height: auto;
	background: #FFFFFF;
	box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.08);
	border-radius: var(--common-radius);
	padding: calc(100vw * (16 / var(--design-width))) calc(100vw * (24 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	word-break: keep-all;
	position: absolute;
	bottom: calc((100vw * (-70 / var(--design-width))));
	right: 0;
	z-index: 10;
	display: none;
}

.card_wrap .c_pop img {
	display: block;
	margin-left: auto;
	width: calc(100vw * (20 / var(--design-width)));
	position: absolute;
	right: calc(100vw * (2 / var(--design-width)));
	top: calc(100vw * (2 / var(--design-width)));
}

.card_wrap .c_pop span {
	margin-top: 0;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.28;
	font-weight: 400;
	color: var(--black-color);
}

.card_wrap .c_card_box.ok {
	padding: calc(100vw * (40 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
}

.card_wrap .c_card_box.ok .d-card-layer {
	margin-top: calc(100vw * (26 / var(--design-width)));
}

.card_wrap .c_card_box.ok .d-card-layer img {
	width: calc(100vw * (168 / var(--design-width)));
}

@keyframes a_ud {
	0% {
		transform: translateY(-5%);
	}

	100% {
		transform: translateY(5%);
	}
}

/* card_wrap */
.card_wrap .c_info_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
	margin-top: calc(100vw * (7 / var(--design-width)));
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	font-weight: 400;
	font-size: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
}

.card_wrap .cr_text {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
}

.card_wrap .cr_index {
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: normal;
	color: var(--gray-color);
}

.card_wrap .cr_btn {
	background: var(--white-color);
	border: 1px solid var(--main-color);
	color: var(--main-color);
	border-radius: calc(100vw * (4 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	height: calc(100vw * (26 / var(--design-width)));
	font-size: calc(100vw * (13 / var(--design-width)));
	padding: 0 calc(100vw * (8 / var(--design-width)));
}

.card_wrap.full .com_btn {
	width: auto;
}

.card_wrap.ok .com_btn {
	width: 100%;
	margin-top: auto;
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

.card_wrap.ok .c_img {
	margin: auto auto 0;
	width: calc(100vw * (74 / var(--design-width)));
	height: calc(100vw * (74 / var(--design-width)));
	border-radius: 50%;
	overflow: hidden;
	background: var(--main-color);
	display: flex;
	align-items: center;
	justify-content: center;
}

.card_wrap.ok .c_img .icon_check {
	display: inline-block;
	width: calc(100vw * (31 / var(--design-width)));
	height: calc(100vw * (25 / var(--design-width)));
	background-color: #FFFFFF;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 31 25\"><path d=\"M0 13.8734C1.43598 12.4217 2.87195 10.9691 4.33068 9.49456C6.52014 11.6968 8.67865 13.8689 10.8526 16.0546C16.1297 10.6955 21.3877 5.35459 26.6602 0C28.1153 1.51576 29.5504 3.01139 31.0009 4.52166C24.2833 11.3298 17.5775 18.1269 10.7971 24.9991C10.7143 24.8746 10.6624 24.7584 10.5787 24.6732C7.13803 21.1584 3.69459 17.6464 0.251159 14.1352C0.17654 14.0592 0.0846298 14.0007 0 13.9348C0 13.9146 0 13.8945 0 13.8734Z\"/></svg>") no-repeat center / contain;
	mask: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 31 25\"><path d=\"M0 13.8734C1.43598 12.4217 2.87195 10.9691 4.33068 9.49456C6.52014 11.6968 8.67865 13.8689 10.8526 16.0546C16.1297 10.6955 21.3877 5.35459 26.6602 0C28.1153 1.51576 29.5504 3.01139 31.0009 4.52166C24.2833 11.3298 17.5775 18.1269 10.7971 24.9991C10.7143 24.8746 10.6624 24.7584 10.5787 24.6732C7.13803 21.1584 3.69459 17.6464 0.251159 14.1352C0.17654 14.0592 0.0846298 14.0007 0 13.9348C0 13.9146 0 13.8945 0 13.8734Z\"/></svg>") no-repeat center / contain;
}

.card_wrap.ok .c_index {
	margin: calc(100vw * (40 / var(--design-width))) auto calc(100vw * (12 / var(--design-width)));
}

.card_wrap.ok .c_card_text {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.5;
	text-align: center;
	color: var(--gray-color);
	width: calc(100vw * (210 / var(--design-width)));
}

.card_wrap .c_nocard {
	margin-bottom: calc(100vw * (180 / var(--design-width)));
}

.card_wrap .c_dcard {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
	width: 100vw;
	height: calc(100vw * (400 / var(--design-width)));
	position: relative;
	background: var(--box-bg-color);
	background-size: calc(100vw * (375 / var(--design-width))) calc(100vw * (401 / var(--design-width)));
	padding: calc(100vw * (48 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
}

.page-big-title {
	width: calc(100vw * (180 / var(--design-width)));
	color: var(--black-color);
	font-size: calc(100vw * (26 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4;
}

/* card_wrap */
.card_wrap .c_dcard .cd_img {
	width: calc(100vw * (302 / var(--design-width)));
	aspect-ratio: 608/320;
	margin-top: calc(100vw * (44 / var(--design-width)));
}

.card_wrap .c_dcard img {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	animation: a_ud2 3s ease-in-out alternate-reverse infinite;
}

.floating_btn_wrap {
	position: fixed;
	bottom: calc(100vw * (86 / var(--design-width)));
	left: 0;
	z-index: 2;
	display: flex;
	justify-content: center;
	width: 100%;
}

.card_regist_btn {
	width: auto;
	padding: 0 calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (52 / var(--design-width)));
	border-radius: var(--out-radius);
}

#btn_card_check {
	margin: 0 0 0 calc(100vw * (16 / var(--design-width)));
}

@keyframes a_ud2 {
	0% {
		transform: translateY(0%);
	}

	100% {
		transform: translateY(-7%);
	}
}

.cd_status {
	display: flex;
	margin-top: calc(100vw * (-30 / var(--design-width)));
	padding: calc(100vw * (20 / var(--design-width)));
	justify-content: center;
	align-items: center;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.80);
	backdrop-filter: blur(10px);
	gap: calc(100vw * (8 / var(--design-width)));
	box-shadow: var(--btn-shadow);
}

/* card_wrap */
.card_wrap .cd_text {
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
}

.card_wrap .c_deltit {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.5em;
	text-align: center;
	color: var(--black-color);
	margin-top: calc(100vw * (17 / var(--design-width)));
}

.card_wrap .c_delivery {
}

.card_wrap .mc_img {
	display: flex;
	flex-direction: column;
	padding-left: calc(100vw * (24 / var(--design-width)));
	background-image: url(../image/sub/mc_img.png);
	background-size: 100% 100%;
	width: calc(100vw * (297 / var(--design-width)));
	height: calc(100vw * (186 / var(--design-width)));
	margin: calc(100vw * (50 / var(--design-width))) auto;
}

.card_wrap .mc_num {
	font-weight: 600;
	font-size: calc(100vw * (29 / var(--design-width)));
	line-height: 1.5em;
	color: #FFFFFF;
	margin-top: calc(100vw * (6 / var(--design-width)));
	margin-bottom: calc(100vw * (25 / var(--design-width)));
	letter-spacing: calc(100vw * (-1.36 / var(--design-width)));
}

.card_wrap .mc_num .unit {
	font-weight: 400;
}

.card_wrap .mc_num b {
	font-weight: 600;
}

.card_wrap .mc_num span {
	font-size: calc(100vw * (19 / var(--design-width)));
}

.card_wrap .mc_text {
	font-weight: 600;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.25em;
	color: rgba(255, 255, 255, 0.5);
	margin-top: auto;
}

.card_wrap .mc_index {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.4em;
	text-align: center;
	color: var(--black-color);
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.card_wrap .mc_tit {
	margin-top: calc(100vw * (6 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	gap: calc(100vw * (6 / var(--design-width)));
	text-align: center;
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.25em;
	color: var(--black-color);
}

.card_wrap .mc_tit img {
	width: calc(100vw * (21 / var(--design-width)));
	aspect-ratio: 66/48;
}

.card_wrap .mc_info {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width))) 0;
	border-top: 0;
	border-bottom: 0;
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
}

.card_wrap .mc_notice {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(100vw * (16 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	margin: calc(100vw * (10 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (120 / var(--design-width)));
	background: var(--white-color);
	box-shadow: var(--btn-shadow);
	border-radius: var(--common-radius);
	height: calc(100vw * (66 / var(--design-width)));
}

.card_wrap .mc_notice .mc_ntext {
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.16;
	color: var(--black-color);
}

.card_wrap .mc_notice .mc_nbtn {
	background: url("../image/sub/card_view.png")no-repeat;
	border-radius: 0;
	padding: 0;
	color: #FFF;
	font-size: 0;
	width: calc(100vw * (16 / var(--design-width)));
	height: calc(100vw * (16 / var(--design-width)));
	background-size: 100% 100%;
}

/* up_box 활용한 모달팝업 */
.mc_up .bg {
	width: 100vw;
	height: 200vh;
	background-color: rgba(0, 0, 0, 0.5);
	position: fixed;
	bottom: 0;
	left: 0;
	display: none;
}

.mc_up .u_title {
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
	flex-direction: column-reverse;
}
.mc_up .u_title span {
	display: block;
	width: 100%;
}

.bank_up .u_title {
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
	flex-direction: column-reverse;
}
.bank_up .u_title span {
	display: block;
	width: 100%;
}
.bank_up .up_box {
	padding: 0 calc(100vw * (20 / var(--design-width)));
}

.card_contact_btn {
	margin: 0 calc(100vw * (16 / var(--design-width))) calc(100vw * (120 / var(--design-width)));
}

.com_btn_group .com_btn {
	flex: 1;
}

/* card_wrap */
.card_wrap.full .com_btn_group .com_btn#btn_card_regist {
	flex: 2;
}

.card_wrap.full .com_btn_group .com_btn#btn_card_regist.unable {
	color: var(--gray-color);
}

.card_wrap.full .com_btn_group.lost .com_btn.ok {
	width: 65%;
	flex: unset;
}

.card_wrap.full.withdraw .com_btn_group .com_btn.unable {
	background-color: var(--box-bg-color);
	color: var(--gray-color);
	border: 0;
}

.com_btn_group #btn_card_charge {
	width: 65%;
}

/* mc_up */
.mc_up .u_tit {
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: normal;
	text-align: left;
	color: var(--gray-color);
	margin-top: calc(100vw * (40 / var(--design-width)));
}

.mc_up .u_tit p {
	position: relative;
	padding-left: calc(100vw * (10 / var(--design-width)));
	line-height: 1.4;
}

.mc_up .u_tit p:before {
	content: "";
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	background-color: var(--gray-color);
	border-radius: 100%;
	position: absolute;
	left: 0;
	top: calc(100vw * (8 / var(--design-width)));
}

.mc_up .com_btn_group {
	margin-bottom: 0;
}

.mc_pop {
	background-color: rgba(0, 0, 0, 0.5);
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 222;
}

/* mc_pop_box */
.mc_pop_box {
	position: absolute;
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	background: #FFFFFF;
	border-radius: var(--out-radius);
	padding: calc(100vw * (40 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	width: calc(100vw - (100vw * (32 / var(--design-width))));
	display: flex;
	flex-direction: column;
	align-items: center;
}

.mc_pop_box .icon_check {
	width: calc(100vw * (54 / var(--design-width)));
	height: calc(100vw * (40 / var(--design-width)));
	background: var(--main-color);
	mask: url("../image/sub/icon_check.svg") no-repeat center / contain;
	-webkit-mask: url("../image/sub/icon_check.svg") no-repeat center / contain;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.mc_pop_box .pop_title {
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
	line-height: 1.25em;
	text-align: center;
	color: var(--main-color);
}

.mc_pop_box .pop_tit {
	font-size: calc(100vw * (16 / var(--design-width)));
	margin-top: calc(100vw * (16 / var(--design-width)));
	line-height: 1.4;
	text-align: center;
	color: var(--black-color);
}

.mc_pop_box .pop_tit .unit {
	color: var(--main-color);
}

.mc_pop_box .pop_tit span {
	color: var(--main-color);
}

.mc_pop_box .pop_btn {
	display: block;
	width: 100%;
	height: calc(100vw * (52 / var(--design-width)));
	padding: calc(100vw * (14 / var(--design-width)));
	text-align: center;
	color: var(--black-color);
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	border: 1px solid var(--border-color);
	margin-top: calc(100vw * (30 / var(--design-width)));
	border-radius: var(--common-radius);
}

.c_mycard {
}

/* c_lost */
.c_lost .c_etext {
	margin-top: calc(100vw * (20 / var(--design-width)));
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: normal;
	text-align: center;
	color: var(--black-color);
}

.c_lost .c_ebox {
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (21 / var(--design-width)));
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
}

.cr_text.sky {
	color: var(--main-color);
}

.c_lost .c_notice {
	margin-bottom: calc(100vw * (180 / var(--design-width)));
}

/* card_wrap */
.card_wrap .history_img {
	margin: calc(100vw * (40 / var(--design-width))) auto 0;
	padding: calc(100vw * (72 / var(--design-width))) calc(100vw * (24 / var(--design-width))) 0;
	background-image: url(../image/sub/mc_img.png);
	width: calc(100vw * (297 / var(--design-width)));
	height: calc(100vw * (186 / var(--design-width)));
	background-size: cover;
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
}

.card_wrap .c_h_title {
	font-weight: 600;
	font-size: calc(100vw * (12 / var(--design-width)));
	line-height: 1.2em;
	color: #FFFFFF;
	opacity: 0.5;
}

.card_wrap .c_h_number {
	font-weight: 600;
	font-size: calc(100vw * (19 / var(--design-width)));
	line-height: 1.35em;
	letter-spacing: 0.1em;
	color: #FFFFFF;
}

.card_wrap .card_inrow {
	gap: calc(100vw * (21 / var(--design-width)));
}

.card_wrap .c_h_number.sm {
	font-size: calc(100vw * (15 / var(--design-width)));
}

.lost_btn_group {
	display: flex;
	align-items: center;
	flex-direction: column;
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width))) 0;
	background: #FFF;
	border-radius: var(--common-radius);
	padding: calc(100vw * (8 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	box-shadow: var(--box-shadow);
}

/* lost_btn */
.lost_btn {
	width: 100%;
	display: flex;
	align-items: center;
	height: calc(100vw * (62 / var(--design-width)));
	justify-content: space-between;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
	word-break: keep-all;
	overflow-wrap: anywhere;
	font-weight: 600;
}

.lost_btn .label {
	display: flex;
	align-items: center;
	gap: calc(100vw * (8 / var(--design-width)));
}

.lost_btn .label img {
	width: calc(100vw * (24 / var(--design-width)));
	height: auto;
}

/* card_wrap */
.card_wrap .c_lostbox {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
	margin-top: calc(100vw * (20 / var(--design-width)));
	border-radius: var(--common-radius);
	border: 1px solid var(--border-color);
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	font-weight: 400;
	font-size: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
}

.card_wrap .c_lostbox .c_row:last-child .cr_text {
	font-size: calc(100vw * (20 / var(--design-width)));
}

.card_wrap .c_lostbox .c_row:last-child .cr_text span {
	letter-spacing: calc(100vw * (-0.8 / var(--design-width)));
	font-weight: 600;
}

.card_wrap .c_notice .c_ntit {
	font-weight: 400;
	font-size: calc(100vw * (15 / var(--design-width)));
	line-height: 1.6;
	color: var(--black-color);
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.com_btn_group.lost {
	margin-top: 0;
}

/* card_wrap */
.card_wrap.withdraw {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.card_wrap.withdraw .card_withdraw_title {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	margin-top: calc(100vw * (40 / var(--design-width)));
}

.card_wrap.withdraw .card_withdraw_tit {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: #909090;
	margin: calc(100vw * (12 / var(--design-width))) 0 calc(100vw * (20 / var(--design-width)));
}

.card_wrap.withdraw .card_withdraw_select {
	display: flex;
	align-items: center;
	gap: calc(100vw * (12 / var(--design-width)));
	justify-content: space-between;
	padding: calc(100vw * (19 / var(--design-width))) calc(100vw * (21 / var(--design-width)));
	background: #fff;
	font-size: calc(100vw * (17 / var(--design-width)));
	font-weight: 600;
	border-radius: var(--common-radius);
	border: 1px solid var(--border-color);
}

/* com_btn_group */
.com_btn_group.withdraw {
	margin-top: auto;
}

.com_btn_group.withdraw .com_btn {
	flex: 1;
	margin-top: 0;
}

.com_btn_group.withdraw .unable {
	background: #FFF;
	border: 1px solid var(--main-color);
	color: var(--main-color);
}

/* select_modal */
.select_modal .select_modal_group {
	display: flex;
	flex-direction: column;
}

.select_modal .modal_select {
	height: calc(100vw * (60 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 0;
	font-size: calc(100vw * (18 / var(--design-width)));
}

.select_modal .radio_mark {
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	border-radius: 50%;
	border: 1.5px solid #ddd;
	display: flex;
	align-items: center;
	justify-content: center;
}

.select_modal .modal_select.on .radio_mark {
	border-color: var(--main-color);
}

.select_modal .modal_select.on .radio_mark span {
	display: block;
	width: calc(100vw * (16 / var(--design-width)));
	height: calc(100vw * (16 / var(--design-width)));
	border-radius: 50%;
	background: var(--main-color);
}

.select_modal .com_modal_btn_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.select_modal .com_btn {
	margin: 0;
	flex: 5;
}

.select_modal .unable {
	flex: 3;
	background-color: transparent;
	border: 1px solid var(--border-color);
	color: var(--black-color);
}

.select_modal.on {
	transform: translateY(0%) !important;
}

/* card_load_modal */
.card_load_modal .card_load_select_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (8 / var(--design-width)));
}

.card_load_modal .card_load_select {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--common-radius);
	height: calc(100vw * (52 / var(--design-width)));
	background: var(--box-bg-color);
	color: var(--black-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

.card_load_modal .com_modal_box {
	background-color: #FFF;
}

.card_load_modal.on {
	transform: translateY(0%);
}

/* foreign_load */
.foreign_load .foreign_input,
.local_load .foreign_input {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.foreign_load .input_title,
.local_load .input_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--gray-color);
}

.foreign_load input,
.local_load input {
	padding: calc(100vw * (16 / var(--design-width)));
	border-radius: var(--common-radius);
	font-size: calc(100vw * (16 / var(--design-width)));
	border: 1px solid var(--border-color);
}

.foreign_load input[readonly],
.local_load input[readonly] {
	background: var(--box-bg-color);
	border: none;
}

.foreign_load .modal_btn_group,
.local_load .modal_btn_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
}

.foreign_load .modal_btn_group .com_btn,
.local_load .modal_btn_group .com_btn {
	margin-bottom: 0;
}

.foreign_load.on,
.local_load.on {
	transform: translateY(0%);
}

.card_exit_title {
	margin: calc(100vw * (40 / var(--design-width))) 0 calc(100vw * (12 / var(--design-width)));
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
}

.card_exit_tit {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: #909090;
}

.card_exit_list_group {
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
}

.card_exit_list {
	height: calc(100vw * (68 / var(--design-width)));
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	font-size: calc(100vw * (18 / var(--design-width)));
}

.card_exit_radio {
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	background: var(--border-color);
	mask: url("../image/sub/chk_normal.svg") no-repeat center / contain;
	-webkit-mask: url("../image/sub/chk_normal.svg") no-repeat center / contain;
}

.card_exit_list.on .item_title {
	color: var(--main-color);
	font-weight: 600;
}

.card_exit_list.on .card_exit_radio {
	background: var(--main-color);
}

.exit_modal.on {
	transform: translateY(0%);
}

/* foreign */
.foreign_wrap * {
}

.foreign_wrap {
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: calc(100vh - calc(100vw * (60 / var(--design-width))));
	padding: calc(100vw * (25 / var(--design-width))) calc(100vw * (25 / var(--design-width))) 0;
}

.foreign_wrap .title {
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
	line-height: 1.4em;
	color: var(--black-color);
	margin-bottom: calc(100vw * (50 / var(--design-width)));
}

.foreign_wrap .fr_title {
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	color: #999999;
}

.foreign_wrap .fr_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
}

.foreign_wrap .fr_text {
	padding: calc(100vw * (19 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
	background: #FFFFFF;
	border-radius: var(--common-radius);
	margin-top: calc(100vw * (9 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
}

.lang_wrap.list {
	position: fixed;
	top: calc(100vw * (60 / var(--design-width)));
	left: 0;
	width: 100%;
	background-color: var(--background-color);
	transform: translateY(100%);
	transition: 0.5s;
}

.contact_wrap {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.form_request {
	display: contents;
}

.c_write {
	flex: 1;
	flex-direction: column;
	height: 100%;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
}

/* contact_wrap */
.contact_wrap.full {
	display: flex;
	flex-direction: column;
	min-height: calc(100vh - (100vw * (50 / var(--design-width))));
	overflow: hidden;
}

.contact_wrap .contact_menu {
	display: flex;
	gap: calc(100vw * (24 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
	padding: 0 calc(100vw * (16 / var(--design-width)));
	flex-shrink: 0;
}

.contact_wrap .c_menu {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: calc(100vw * (65 / var(--design-width)));
	color: var(--gray-color);
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	transition: 0.3s;
	border-bottom: 2px solid transparent;
}

.contact_wrap .c_menu.active {
	color: var(--main-color);
	border-color: var(--main-color);
}

.contact_title {
	color: var(--black-color);
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4;
	padding: 0 calc(100vw * (16 / var(--design-width)));
	width: 90%;
}

/* contact_wrap */
.contact_wrap .c_row {
	margin-bottom: calc(100vw * (30 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (12 / var(--design-width)));
}

.contact_wrap .c_title {
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--gray-color);
}

.contact_wrap .c_tit {
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: normal;
	text-align: right;
	color: var(--gray-color);
}

.contact_wrap .c_box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: calc(100vw * (59 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2;
	background: #FFF;
	border-bottom: 1px solid var(--border-color);
	padding: 0 calc(100vw * (12 / var(--design-width)));
	color: var(--black-color);
}

.contact_wrap .c_box.gray {
	background-color: var(--box-bg-color);
}

.contact_wrap .c_box img {
	width: calc(100vw * (12 / var(--design-width)));
}

.contact_wrap .c_box::placeholder {
	color: var(--placeholder);
}

.contact_wrap textarea.c_box {
	padding: 0;
	resize: none;
	height: calc(100vw * (120 / var(--design-width)));
	padding: calc(100vw * (12 / var(--design-width)));
}

/* contact_pop */
.contact_pop {
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 55;
	transform: translateY(100%);
	transition: 0.5s;
}

.contact_pop .bg {
	width: 100vw;
	height: 200vh;
	background-color: rgba(0, 0, 0, 0.5);
	position: fixed;
	bottom: 0;
	left: 0;
	display: none;
}

/* c_pop_box */
.c_pop_box {
	background: #FFFFFF;
	width: 100%;
	border-radius: var(--out-radius) var(--out-radius) 0 0;
	position: absolute;
	left: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	max-height: 80vh;
}

.c_pop_box .modal_xbtn {
	flex-shrink: 0;
	width: 100%;
	height: calc(100vw * (36 / var(--design-width)));
	position: unset;
	z-index: 3;
	background-image: url("../image/sub/up_x_btn_renew.png");
	background-size: calc(100vw * (40 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
}

.c_pop_box .modal_xbtn img {
	display: none;
}

.c_pop_box .modal_title {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	padding: 0 calc(100vw * (20 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	flex-shrink: 0;
}

.c_pop_box .scroll_inner {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	flex: 1;
	overflow-x: hidden;
	margin: 0 calc(100vw * (20 / var(--design-width)));
	padding-bottom: calc(100vw * (20 / var(--design-width)));
}

/* 문의 유형 */
.cp_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: calc(100vw * (62 / var(--design-width)));
}

.cp_row label {
	flex: 1;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2;
	color: var(--black-color);
	position: relative;
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	height: 100%;
}

.cp_row input[name="cpop"] {
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	order: 2;
	display: none;
}

.cp_row label::before {
	content: "";
	display: block;
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	background: var(--border-color);
	mask: url("../image/sub/chk_normal.svg") no-repeat center / contain;
	-webkit-mask: url("../image/sub/chk_normal.svg") no-repeat center / contain;
}
.cp_row input:checked + label {
	font-weight: 600;
	color: var(--main-color);
}
.cp_row input:checked + label:before {
	background: var(--main-color);
}

/* contact_wrap */
.contact_wrap .c_num {
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2;
	color: var(--gray-color);
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width))) 0;
	flex-shrink: 0;
}

.contact_wrap .c_listbox {
	border-top: 1px solid var(--border-color);
	margin: calc(100vw * (20 / var(--design-width))) calc(100vw * (16 / var(--design-width))) 0;
	overflow-y: auto;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

.contact_wrap .c_list {
	padding: calc(100vw * (23 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	transition: 0.3s;
}

.contact_wrap .c_list .row1 {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.25em;
	color: var(--black-color);
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

/* c_request_wrap */
.c_request_wrap .c_list .row1 {
	margin-bottom: 0;
	line-height: 1.6;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
}

.c_request_wrap .c_list .c_list_item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: calc(100vw * (8 / var(--design-width)));
}

.contact_wrap .cr_req {
	font-weight: 400;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.6;
	color: var(--black-color);
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.c_request_wrap .cr_req {
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	padding-bottom: calc(100vw * (20 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

/* contact_wrap */
.contact_wrap .cr_title {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (10 / var(--design-width)));
}

.contact_wrap .cr_title .cr_intxt {
	max-width: calc(100vw * (220 / var(--design-width)));
	overflow: hidden;
	white-space: normal;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	word-break: break-all;
	line-height: normal;
	font-size: calc(100vw * (16 / var(--design-width)));
}

.c_request_wrap .cr_title .cr_intxt {
	max-width: 100%;
	overflow: visible;
	white-space: normal;
	text-overflow: clip;
	display: block;
	-webkit-line-clamp: unset;
	-webkit-box-orient: unset;
	line-height: 1.4;
}

/* contact_wrap */
.contact_wrap .cr_title .cr_intxt * {
	line-height: 1.2em;
}

.contact_wrap .cr_icon {
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	color: var(--white-color);
	padding: calc(100vw * (5 / var(--design-width))) calc(100vw * (8 / var(--design-width)));
	border-radius: var(--out-radius);
	background: var(--black-color);
	align-self: flex-start;
}

.contact_wrap .cr_icon.done {
	background-color: var(--main-color);
}

.contact_wrap .cr_img {
	display: flex;
	align-items: flex-start;
	width: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (9 / var(--design-width)));
	background-image: url(../image/common/sub_list_link_renew.png);
	background-size: 100% 100%;
	transform: rotate(180deg);
	transition: 0.5s;
}

.contact_wrap .cr_img img {
	display: none;
}

.c_request_wrap .cr_img {
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(100vw * (21 / var(--design-width)));
	height: calc(100vw * (21 / var(--design-width)));
	background-image: url("/image/sub/icon_arrow_down.svg");
	background-size: 100% 100%;
	transform: rotate(0);
	transition: 0.5s;
	flex-shrink: 0;
}

/* contact_wrap */
.contact_wrap .c_list.active .cr_img {
	transform: rotate(180deg);
	transition: 0.5s;
}

.contact_wrap .c_list .row2 {
	margin-top: calc(100vw * (10 / var(--design-width)));
	padding-left: calc(100vw * (65 / var(--design-width)));
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.25em;
	color: var(--gray-color);
	transition: 0.5s;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.c_request_wrap .c_list .row2 {
	margin-top: calc(100vw * (10 / var(--design-width)));
	padding-left: 0;
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	margin-bottom: 0;
}

.contact_wrap .c_list .row3 {
	padding-top: calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: row;
	gap: calc(100vw * (10 / var(--design-width)));
	border-top: 1px solid var(--border-color);
}

.c_request_wrap .c_list .row3 {
	padding-top: 0;
	display: flex;
	flex-direction: row;
	gap: calc(100vw * (10 / var(--design-width)));
	border-top: 0;
}

.contact_wrap .c_list .row3 .reple {
	width: calc(100vw * (12 / var(--design-width)));
	display: inline;
	border-radius: var(--common-radius);
	color: var(--main-color);
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.6;
}

.c_request_wrap .c_list .row3 .reple {
	width: calc(100vw * (30 / var(--design-width)));
	height: calc(100vw * (30 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--common-radius);
	color: var(--main-color);
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1;
	background: var(--box-bg-color);
	flex-shrink: 0;
}

.contact_wrap .c_list .row3 .cr_ans {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.6;
	color: var(--black-color);
}

.c_request_wrap .c_list .row3 .cr_ans {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
}

.contact_wrap .c_list .slide_row {
	display: none;
	margin: calc(100vw * (20 / var(--design-width))) 0 0;
	padding: calc(100vw * (20 / var(--design-width))) 0 0;
	border-top: 1px solid var(--border-color);
}

.c_request_wrap .c_list .slide_row {
	margin: calc(100vw * (10 / var(--design-width))) 0 0;
	padding: 0;
	border-top: 0;
}

/* contact_wrap */
.contact_wrap .c_list.active .cr_img img {
	transform: rotate(180deg);
}

.contact_wrap .c_request {
	display: none;
	flex-direction: column;
	flex: 1;
	height: 100%;
}

.request_wrapper {
	display: flex;
	flex-direction: column;
	min-height: calc(100vh - (100vw * (60 / var(--design-width))));
	overflow: hidden;
}

/* c_request_wrap */
.c_request_wrap {
	display: flex;
	flex-direction: column;
	flex: 1;
	height: 100%;
}

.c_request_wrap .c_list {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.c_request_wrap .c_listbox {
	border-top: 0;
	margin: calc(100vw * (20 / var(--design-width))) 0 0;
	padding: 0 calc(100vw * (16 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
	flex: 1;
	height: 100%;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
}

/* contact_wrap */
.contact_wrap.notice .c_request {
	display: flex;
	flex-direction: column;
	min-height: calc(100vh - (100vw * (60 / var(--design-width))));
}

.contact_wrap.notice .c_list {
	display: block;
	padding: calc(100vw * (20 / var(--design-width))) 0;
	border-bottom: 1px solid var(--border-color);
}

.contact_wrap.notice .c_list .row2 {
	padding-left: 0;
	margin-bottom: 0;
	margin-top: 0;
}

.contact_wrap.notice .cr_title img {
	width: calc(100vw * (10 / var(--design-width)));
	max-width: 99%;
	display: none;
}

.contact_wrap.notice .cr_title {
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
}

.contact_wrap.notice .n_title {
	padding-left: calc(100vw * (16 / var(--design-width)));
	padding-right: calc(100vw * (16 / var(--design-width)));
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	line-height: normal;
	margin-top: calc(100vw * (50 / var(--design-width)));
}

.contact_wrap.notice .n_tit {
	margin: calc(100vw * (12 / var(--design-width))) calc(100vw * (16 / var(--design-width))) 0;
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	padding-bottom: calc(100vw * (30 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

.contact_wrap.notice .com_btn {
	width: calc(100% - (100vw * (32 / var(--design-width))));
	margin: auto auto calc(100vw * (30 / var(--design-width)));
}

.contact_wrap.notice .editor {
	align-items: flex-start;
	color: var(--black-color);
	padding: calc(100vw * (30 / var(--design-width))) 0 0;
	margin: 0 calc(100vw * (16 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.6;
}

.contact_wrap.max {
	min-height: 100vh;
}

/* c_request */
.c_request,
.c_write {
	display: none;
}

.c_request.active,
.c_write.active {
	display: flex;
}

/* ect_wrap_common_object */
.ect_wrap_common_object {
	width: 100%;
	min-height: calc(100vh - calc(100vw * (60 / var(--design-width))));
	padding: 0 calc(100vw * (25 / var(--design-width)));
}

.ect_wrap_common_object .com_input_group {
	margin-bottom: 20px;
	background-color: #FFF;
	width: 100%;
	height: calc(100vw * (62 / var(--design-width)));
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 10px;
}

.ect_wrap_common_object .com_input_group input {
	width: 100%;
	font-size: calc(100vw * (18 / var(--design-width)));
	padding: 0 calc(100vw * (10 / var(--design-width)));
}

.ect_wrap_common_object .com_input_group .input_x_btn {
	min-width: calc(100vw * (20 / var(--design-width)));
	min-height: calc(100vw * (20 / var(--design-width)));
	background-color: #a3a3a3;
	border-radius: 50%;
	background-image: url(../image/common/gnb_xbtn.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 50%;
}

.push_wrap {
	width: 100%;
	flex: 1;
	padding: 0 calc(100vw * (16 / var(--design-width)));
	background-color: var(--background-color);
	overflow-y: auto;
	align-content: center;
	display: flex;
	flex-direction: column;
}

.push_group {
	margin-top: calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (10 / var(--design-width)));
	padding-bottom: calc(100vw * (20 / var(--design-width)));
	flex: 1;
}

/* push_wrap */
.push_wrap .p_item {
	background: #FFF;
	padding: calc(100vw * (20 / var(--design-width))) 0;
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (6 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

.push_wrap .p_item .row4 {
	line-height: 1.4;
}

.push_wrap .p_item .row1 {
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
}

.push_wrap .p_item .row1_txt {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-break: break-all;
}

.push_wrap .p_item .row2 {
	font-weight: 400;
	font-size: calc(100vw * (12 / var(--design-width)));
	line-height: 1.2;
	color: #9F9F9F;
}

.push_wrap .p_item .row3:empty {
	display: none;
}

/* event_wrap */
.event_wrap {
	width: 100%;
	min-height: calc(100vh - calc(100vw * (50 / var(--design-width))));
	display: flex;
	flex-direction: column;
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
}

.event_wrap .e_group {
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.event_wrap .e_item {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (17 / var(--design-width)));
	padding: calc(100vw * (28 / var(--design-width))) 0;
}

.event_wrap .e_item.end .s3_item::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.5);
	z-index: 1;
}

.event_wrap .e_item.end .s3_item::after {
	content: "종료";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(100vw * (80 / var(--design-width)));
	height: calc(100vw * (80 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--black-color);
	color: var(--white-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	z-index: 2;
}

.event_wrap .e_item .right {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: calc(100vw * (8 / var(--design-width)));
	font-size: calc(100vw * (17 / var(--design-width)));
	font-weight: 600;
	line-height: 1.2em;
	color: var(--black-color);
}

.event_wrap .e_item .right .ei_tit {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.25em;
}

.common_wrap.guide_wrap {
	overflow-y: hidden;
	padding-bottom: calc(100vw * (50 / var(--design-width)));
}

/* guide_wrap */
.guide_wrap * {
}

.guide_wrap {
	width: 100%;
	background-color: var(--background-color);
	display: flex;
	flex-direction: column;
}

.guide_wrap .title {
	margin-top: calc(100vw * (50 / var(--design-width)));
	font-size: calc(100vw * (28 / var(--design-width)));
	text-align: center;
	font-weight: 600;
	line-height: 1.3em;
}

.guide_wrap .tit {
	color: var(--main-color);
	text-align: center;
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
	padding: 0 calc(100vw * (16 / var(--design-width)));
}

.guide_wrap .title span {
	display: inline-block;
	width: calc(100vw * (76 / var(--design-width)));
}

.guide_wrap .img_box {
	width: calc(100vw * (325 / var(--design-width)));
	margin: 0 auto;
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.guide_wrap .con4 .img_box {
	width: 100%;
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.guide_wrap .num {
	width: calc(100vw * (25 / var(--design-width)));
	height: calc(100vw * (25 / var(--design-width)));
	margin: 0 auto;
	background-color: var(--main-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFF;
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	margin-top: calc(100vw * (72 / var(--design-width)));
	margin-bottom: calc(100vw * (8 / var(--design-width)));
}

.guide_wrap .sub_tit {
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.35em;
	text-align: center;
	color: #4e4e4e;
	margin-top: calc(100vw * (14 / var(--design-width)));
	padding: 0 calc(100vw * (16 / var(--design-width)));
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.guide_wrap .con {
	width: 100%;
}

.guide_wrap .con1 .img_box {
	width: 100%;
	margin-top: calc(100vw * (32 / var(--design-width)));
	background-image: url(../image/sub/con1_bg2_new_renew.png);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
}

.guide_wrap .con1 .img_box img {
	margin: 0 auto;
	width: calc(100vw * (263 / var(--design-width)));
	animation: guide_a ease-in-out 1.5s infinite alternate;
}

@keyframes guide_a {
	0% {
		transform: translateY(-10%);
	}

	100% {
		transform: translateY(0%);
	}
}

/* guide_wrap */
.guide_wrap .con6 {
}

.guide_wrap .con6 .img_box {
	width: 100%;
	height: calc(100vw * (338 / var(--design-width)));
	background-image: url(../image/sub/con6_bg2_new_renew.png);
	background-size: calc(100vw * (290 / var(--design-width)));
	background-repeat: no-repeat;
	background-position: center right;
}

.guide_wrap .con6 .img_box img {
	width: calc(100vw * (314 / var(--design-width)));
	margin: 0 auto;
}

.guide_wrap .end {
	height: 1px;
}

.common_wrap.full {
	overflow-y: unset;
}

/* point_wrap */
.point_wrap * {
	position: relative;
}

.point_wrap {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	padding: 0 calc(100vw * (16 / var(--design-width)));
	display: flex;
	flex-direction: column;
}

.point_wrap .point_switch {
	display: flex;
	align-items: center;
	gap: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (21 / var(--design-width)));
	line-height: normal;
	color: var(--gray-color);
	position: fixed;
	z-index: 10;
	background: var(--background-color);
	width: 100%;
	top: calc(100vw * (60 / var(--design-width)));
	overflow-x: auto;
	flex-wrap: nowrap;
	padding-left: calc(100vw * (8 / var(--design-width)));
	padding: calc(100vw * (35 / var(--design-width))) calc(100vw * (8 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
}

.point_wrap .point_switch .switch {
	padding-bottom: calc(100vw * (2 / var(--design-width)));
	opacity: 0.5;
	white-space: nowrap;
	flex: 0 0 auto;
}

.point_wrap .point_switch:after {
	content: "";
	flex: 0 0 calc(100vw * (24 / var(--design-width)));
}

.point_wrap .point_switch .switch.active {
	color: var(--sub-color);
	border-bottom: 0;
	opacity: 1;
}

.point_wrap .point_box {
	padding: calc(100vw * (20 / var(--design-width))) 0 calc(100vw * (15 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
	background: #EBEBF1;
	box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.01);
	border-radius: var(--out-radius);
	overflow: hidden;
}

.point_wrap .point_co .row1 {
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: calc(100vw * (16 / var(--design-width)));
	color: #999999;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.point_wrap .point_co .row1 .p_btn {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--main-color);
	display: flex;
	align-items: center;
	gap: calc(100vw * (4 / var(--design-width)));
	margin-right: calc(100vw * (20 / var(--design-width)));
}

.point_wrap .corp {
	padding: calc(100vw * (20 / var(--design-width)));
	background-color: var(--main-color);
	border-radius: var(--common-radius);
	color: #FFF;
	margin-right: calc(100vw * (20 / var(--design-width)));
}

.point_wrap .corp_title {
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.35em;
	color: #FFFFFF;
	margin-bottom: calc(100vw * (8 / var(--design-width)));
}

.point_wrap .corp_tit {
	font-weight: 600;
	font-size: calc(100vw * (11 / var(--design-width)));
	line-height: 1.4em;
	margin-bottom: calc(100vw * (50 / var(--design-width)));
}

.point_wrap .corp_point {
	padding: calc(100vw * (7 / var(--design-width))) calc(100vw * (13 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 600;
	font-size: calc(100vw * (12 / var(--design-width)));
	line-height: 1.2em;
	background-color: rgba(255, 255, 255, 0.14);
	border-radius: var(--common-radius);
}

.point_wrap .corp_point .p_num {
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
	line-height: 1.35em;
}

.point_wrap .point_pop_btn {
	margin-top: calc(100vw * (13 / var(--design-width)));
	display: flex;
	align-items: center;
	gap: calc(100vw * (4 / var(--design-width)));
	font-weight: 400;
	font-size: calc(100vw * (12 / var(--design-width)));
	line-height: 1.2em;
	text-decoration-line: underline;
	color: #999999;
}

.point_wrap .point_select {
	margin-top: calc(100vw * (40 / var(--design-width)));
	margin-bottom: calc(100vw * (28 / var(--design-width)));
}

.point_wrap .p_row1 {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
	line-height: 1.2em;
	font-weight: 600;
}

.point_wrap .point_select .p_row1 .p_point {
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.2em;
	color: var(--gray-color);
}

.point_wrap .point_select .p_row1 .p_point span {
	color: var(--main-color);
}

.point_wrap .point_select .point_btn {
	padding: calc(100vw * (18 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
	background: #FFFFFF;
	border-radius: var(--common-radius);
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	line-height: 1.2em;
	color: #DEDEDE;
	margin-top: calc(100vw * (10 / var(--design-width)));
	height: calc(100vw * (70 / var(--design-width)));
	display: flex;
	align-items: center;
}

.point_wrap .p_detail {
	background-color: #FFF;
	color: var(--gray-color);
	display: flex;
	flex-direction: column;
	padding-top: calc(100vw * (22 / var(--design-width)));
	border-radius: var(--common-radius);
	overflow: hidden;
	margin-bottom: calc(100vw * (80 / var(--design-width)));
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.point_wrap .p_detail .d_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 calc(100vw * (15 / var(--design-width)));
	margin-bottom: calc(100vw * (14 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
}

.point_wrap .p_detail .d_row .d_left {
	width: calc(100vw * (140 / var(--design-width)));
}

.point_wrap .p_detail .d_row .d_right {
	color: var(--black-color);
}

.point_wrap .p_detail .d_row2 {
	background-color: var(--box-bg-color);
	margin-bottom: 0;
	padding: calc(100vw * (16 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
}

.point_wrap .p_detail .d_row2 .d_left {
	font-weight: 600;
	line-height: normal;
}

.point_wrap .swiper-slide {
	background-color: #808D93;
	padding: calc(100vw * (16 / var(--design-width)));
	width: calc(100vw * (137 / var(--design-width)));
	border-radius: var(--common-radius);
	color: #FFF;
}

.point_wrap .swiper-slide img {
	opacity: 0.4;
}

.point_wrap .swiper-slide.active img {
	opacity: 1;
}

.point_wrap .corp_swiper {
	margin-top: calc(100vw * (19 / var(--design-width)));
	width: calc(100vw * (305 / var(--design-width)));
	padding-right: calc(100vw * (20 / var(--design-width)));
}

.point_wrap .p_ctitle {
	font-weight: 400;
	font-size: calc(100vw * (15 / var(--design-width)));
	line-height: 1.2em;
	color: var(--black-color);
}

.point_wrap .corp_name {
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.4em;
	margin-top: calc(100vw * (12 / var(--design-width)));
	margin-bottom: calc(100vw * (41 / var(--design-width)));
}

.point_wrap .corp_tit2 {
	font-size: calc(100vw * (11 / var(--design-width)));
	font-weight: 600;
	line-height: 1.3em;
	color: rgba(255, 255, 255, 0.5);
}

.point_wrap .corp_num {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4em;
}

.point_wrap .point_corps {
	position: absolute;
	top: calc(100vw * (20 / var(--design-width)));
	left: calc(100vw * (15 / var(--design-width)));
	width: 100%;
	transform: translateX(100%);
	transition: 0.5s;
}

.point_wrap .point_co {
	transition: 0.5s;
}

.point_wrap .point_pop {
	display: none;
	position: absolute;
	top: calc(100vw * (320 / var(--design-width)));
	left: calc(100vw * (40 / var(--design-width)));
	z-index: 222;
	background-color: #FFF;
	box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.08);
	border-radius: var(--common-radius);
	width: calc(100vw * (280 / var(--design-width)));
	flex-direction: column;
	padding: calc(100vw * (10 / var(--design-width))) calc(100vw * (15 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
}

.point_wrap .point_pop .x_btn_row img {
	display: block;
	margin-left: auto;
	width: calc(100vw * (16 / var(--design-width)));
	margin-bottom: calc(100vw * (5 / var(--design-width)));
}

.point_wrap.remit_inner .btn_remit {
	margin: calc(100vw * (60 / var(--design-width))) 0 calc(100vw * (30 / var(--design-width)));
}

/* password popup */
.pw_modal,
.pw_modal * {
	will-change: transform;
}

.pw_modal {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: auto;
	z-index: 9999;
	transform: translateY(100%);
	transition: 0.5s;
}

.pw_modal .bg {
	background-color: rgba(0, 0, 0, 0.5);
	width: 100%;
	height: 200vh;
	position: absolute;
	bottom: 0;
	left: 0;
	display: none;
}

.pw_modal .pw_box {
	display: flex;
	flex-direction: column;
	background-color: var(--background-color);
	border-radius: var(--out-radius) var(--out-radius) 0 0;
}

.pw_modal .pw_close_btn {
	margin: calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (30 / var(--design-width))) auto;
	width: calc(100vw * (33 / var(--design-width)));
}

.pw_modal .pw_title {
	font-size: calc(100vw * (18 / var(--design-width)));
	text-align: center;
	font-weight: 400;
	margin-bottom: calc(100vw * (26 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	gap: calc(100vw * (10 / var(--design-width)));
}

.pw_modal .pw_title:before {
	content: "";
	width: calc(100vw * (28 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	background: url("/image/common/pocketplus_symbol.svg") no-repeat center / contain;
}

.pw_modal .pw_num {
	display: flex;
	align-items: center;
	gap: calc(100vw * (14 / var(--design-width)));
	justify-content: center;
	margin-bottom: calc(100vw * (100 / var(--design-width)));
}

.pw_modal .pw_dot {
	width: calc(100vw * (8 / var(--design-width)));
	height: calc(100vw * (8 / var(--design-width)));
	border-radius: var(--out-radius);
	background-color: #D6D9E0;
}

.pw_modal .pw_dot.active {
	width: calc(100vw * (10 / var(--design-width)));
	height: calc(100vw * (10 / var(--design-width)));
	background-color: #59A8C8;
}

/* End password popup */



.send_up {
	position: absolute;
	left: 0;
	right: 0;
	transform: translateY(0%);
	transition: 0.5s;
	z-index: 100;
}

.send_up_box {
	background-color: #FFF;
	border-radius: var(--out-radius);
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (20 / var(--design-width))) 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 0 calc(100vw * (12 / var(--design-width))) calc(100vw * (12 / var(--design-width)));
}

/* send_up */
.send_up .profile_pic {
	width: calc(100vw * (80 / var(--design-width)));
	margin-bottom: calc(100vw * (40 / var(--design-width)));
}

.send_up .profile_pic img {
	margin: 0 auto;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.send_up .send_id {
	display: flex;
	align-items: center;
	gap: calc(100vw * (4 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	color: var(--black-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
}

.send_up .send_text {
	text-align: center;
	font-size: calc(100vw * (36 / var(--design-width)));
	font-weight: 600;
	line-height: normal;
	color: var(--black-color);
	line-height: 0.8;
}

.send_up .user_id {
	font-weight: 600;
	color: var(--main-color);
}

.send_up .send_point {
	font-weight: 600;
	color: var(--black-color);
	font-size: calc(100vw * (36 / var(--design-width)));
	letter-spacing: calc(100vw * (-1.44 / var(--design-width)));
}

.send_up .send_text .small_txt {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

.send_up .bg {
	background-color: rgba(0, 0, 0, 0.5);
	width: 100%;
	height: 200vh;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: none;
}

.send_up .com_btn_group .com_btn {
	width: calc(100% - (100vw * (110 / var(--design-width))));
	height: calc(100vw * (58 / var(--design-width)));
}

.send_up .com_btn_group .unable {
	width: calc(100vw * (100 / var(--design-width)));
	height: calc(100vw * (58 / var(--design-width)));
	background: transparent;
	color: var(--black-color);
	border: 1px solid var(--border-color);
}

#btn_layer_ok {
	flex: 2;
}

.ok_pop .pop,
.card_pop .pop {
	width: 95%;
}

.pop_cash_img {
	width: calc(100vw * (70 / var(--design-width)));
	height: calc(100vw * (70 / var(--design-width)));
	margin: 0 auto;
	margin-top: calc(100vw * (25 / var(--design-width)));
}

.pop_common_tit {
	font-size: calc(100vw * (22 / var(--design-width)));
	font-weight: 600;
	color: #111;
	line-height: 1.3em;
	margin: calc(100vw * (20 / var(--design-width))) 0 calc(100vw * (5 / var(--design-width)));
}

/* pop_common_ment */
.pop_common_ment {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	color: #111;
	line-height: 1.5em;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.pop_common_ment.red {
	color: var(--caution-color);
	margin-bottom: calc(100vw * (15 / var(--design-width)));
}

/* pop_common_btn_box */
.pop_common_btn_box {
	display: flex;
	padding: 0 calc(100vw * (25 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
}

.pop_common_btn_box button {
	width: 100%;
	border-radius: var(--common-radius);
	font-size: calc(100vw * (17 / var(--design-width)));
	font-weight: 400;
	height: calc(100vw * (50 / var(--design-width)));
}

.pop_common_btn_box button:first-child {
	flex: 1;
	margin-right: calc(100vw * (8 / var(--design-width)));
}

.pop_common_btn_box button:last-child {
	flex: 2;
	margin-right: unset;
}

.pop_common_btn_box button.grey {
	background-color: #EAEAEA;
	color: #111;
}

.pop_common_btn_box button.black {
	background-color: #050513;
	color: #fff;
}

.pop_card_list {
	width: calc(100vw * (270 / var(--design-width)));
	height: calc(100vw * (72 / var(--design-width)));
	margin: 0 auto;
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

/* common_page_nav */
.common_page_nav {
	justify-content: center;
	margin-top: calc(100vw * (30 / var(--design-width)));
	padding-bottom: calc(100vw * (30 / var(--design-width)));
}

.common_page_nav .arw_btn {
	width: calc(100vw * (40 / var(--design-width)));
	height: calc(100vw * (40 / var(--design-width)));
	border-radius: 50%;
}

.common_page_nav .page_state {
	margin: 0 calc(100vw * (10 / var(--design-width)));
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	color: #999;
}

.common_page_nav .page_state .now {
	color: #000;
}

/* common_no_alt_box */
.common_no_alt_box {
	flex-direction: column;
	width: 100%;
	justify-content: center;
	align-items: center;
	flex: 1;
}

.common_no_alt_box .img_icon {
	width: calc(100vw * (80 / var(--design-width)));
	height: calc(100vw * (80 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.common_no_alt_box .text {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 400;
	color: var(--black-color);
}

.list_wrap select {
	background-image: url(../image/sub/filter_under.png);
	background-position: center right;
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-color: transparent;
}

/* conv_modal */
.conv_modal * {
}

.conv_modal .modal_x_btn {
	width: 100%;
	height: calc(100vw * (36 / var(--design-width)));
	position: unset;
	z-index: 3;
	background-image: url("../image/sub/up_x_btn_renew.png");
	background-size: calc(100vw * (40 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
	margin-top: calc(100vw * (-25 / var(--design-width)));
	display: block;
}

.conv_modal .modal_x_btn img {
	display: none;
}

.conv_modal_inner {
	transform: translateY(100%);
	transition: 0.5s;
	z-index: 999;
	display: flex;
	flex-direction: column;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100vw;
	height: 100vh;
}

/* conv_modal */
.conv_modal {
	margin-top: auto;
	border-radius: var(--out-radius) var(--out-radius) 0 0;
	background-color: var(--white-color);
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
}

.conv_modal .modal_title {
	text-align: center;
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4;
}

.conv_modal .modal_img {
	margin-top: calc(100vw * (20 / var(--design-width)));
	display: flex;
	gap: calc(100vw * (9 / var(--design-width)));
	justify-content: center;
}

.conv_modal .modal_img img {
	display: block;
	width: auto;
	max-height: calc(100vw * (23 / var(--design-width)));
	margin: 0 auto;
}

.conv_modal .conv_box {
	width: 100%;
	border-radius: var(--common-radius);
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (28 / var(--design-width)));
	background-color: var(--box-bg-color);
}

.conv_modal_bg {
	position: fixed;
	width: 100vw;
	height: 200vh;
	bottom: 0;
	left: 0;
	background-color: rgba(0,0,0,0.3);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
	display: none;
}

.barcode_box {
	margin: calc(100vw * (32 / var(--design-width))) 0 calc(100vw * (30 / var(--design-width)));
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
}

/* conv_modal */
.conv_modal .bar_title {
	display: flex;
	align-items: center;
	gap: calc(100vw * (7 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	justify-content: space-between;
}

.conv_modal .bar_title img {
	width: calc(100vw * (24 / var(--design-width)));
}

.conv_modal .bar_btm {
	margin-top: calc(100vw * (10 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: var(--black-color);
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
}

.conv_modal .bar_btm .timer {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--caution-color);
}

.conv_tit {
	color: var(--black-color);
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.conv_modal .total_box {
	padding: 0;
	overflow: hidden;
	background: transparent;
	border: 1px solid var(--border-color);
	border-radius: var(--common-radius);
}

/* conv_row */
.conv_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (15 / var(--design-width))) calc(100vw * (7 / var(--design-width)));
	font-size: 14px;
	font-weight: 400;
}

.conv_row:last-child {
	padding-bottom: calc(100vw * (20 / var(--design-width)));
	background-color: var(--box-bg-color);
}

.conv_row:nth-child(2) {
	padding-bottom: calc(100vw * (15 / var(--design-width)));
}

.conv_row .conv_left {
	color: var(--gray-color);
}

.conv_total {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.conv_modal .com_btn {
	margin: calc(100vw * (24 / var(--design-width))) 0 calc(100vw * (20 / var(--design-width)));
}

.push_wrap .row3 img {
	width: 100%;
}

.empty_list {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: calc(100vw * (10 / var(--design-width)));
	flex: 1;
	width: 100%;
	color: var(--black-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	height: 100%;
}

/* dot_group */
.dot_group {
	height: calc(100vw * (14 / var(--design-width)));
	display: flex;
	gap: calc(100vw * (25 / var(--design-width)));
	align-items: center;
	justify-content: center;
	margin-bottom: calc(100vw * (50 / var(--design-width)));
}

.dot_group .dot {
	width: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	border-radius: 50%;
	background-color: transparent;
	transition: 0.5s;
	border: 1px solid var(--border-color);
}

.dot_group .dot.active {
	width: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	background-color: var(--main-color);
	border-color: var(--main-color);
}

.dot_group .dot.ok {
	width: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	background-color: var(--main-color);
	border-color: var(--main-color);
}

.num_pad {
	bottom: 0;
	left: 0;
	right: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	row-gap: calc(100vw * (17 / var(--design-width)));
	column-gap: calc(100vw * (17 / var(--design-width)));
	padding: calc(100vw * (28 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
	background: transparent;
	box-shadow: unset;
	border-radius: 0;
	justify-items: center;
}

/* pad_A */
.pad_A,
.pad_B,
.pad {
	width: 100%;
	height: calc(100vw * (64 / var(--design-width)));
	border-radius: var(--common-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 400;
	font-size: calc(100vw * (25 / var(--design-width)));
	line-height: normal;
	background: #FFF;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.06);
}

.pad_A img {
	width: calc(100vw * (23 / var(--design-width)));
}

.pad_B img {
	width: calc(100vw * (26 / var(--design-width)));
}

/* section5 */
.section5 .item_group .item .m_event {
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(100vw * (60 / var(--design-width)));
	height: calc(100vw * (60 / var(--design-width)));
	border-radius: 50%;
	overflow: hidden;
	background-color: #E6E6E8;
}

.section5 .item_group .item .m_event img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.section5 .item_group .item .text_col {
	width: 70%;
}

/* header_inner */
.header_inner .profile_img {
	width: calc(100vw * (50 / var(--design-width)));
	height: calc(100vw * (50 / var(--design-width)));
	border-radius: 50%;
	overflow: hidden;
}

.header_inner .profile_img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.header_inner .profile_text {
	margin-left: calc(100vw * (25 / var(--design-width)));
	display: flex;
	flex-direction: column;
}

.section3 .item_group img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.event_wrap .s3_item {
	width: 100%;
	height: calc(100vw * (225 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: var(--out-radius);
	position: relative;
}

/* point_wrap */
.point_wrap .point_select input {
	font-weight: 600;
	font-size: calc(100vw * (34 / var(--design-width)));
	line-height: 1.2em;
	max-width: 100%;
	width: 100%;
	text-align: right;
}

.point_wrap .point_select input::placeholder {
	color: var(--placeholder);
	font-size: calc(100vw * (18 / var(--design-width)));
}

.point_wrap .p_detail input {
	text-align: right;
	margin-bottom: calc(100vw * (4 / var(--design-width)));
	margin-right: calc(100vw * (5 / var(--design-width)));
	background-color: transparent;
	max-width: calc(100vw * (130 / var(--design-width)));
	font-weight: inherit;
}

.point_wrap .p_detail input.bold {
	font-weight: 600;
}

.point_wrap .p_detail .d_row2 .d_right {
	font-weight: 600;
}

.point_wrap .detail_input {
	display: flex;
	align-items: center;
}

.point_wrap .detail_input input {
	color: #999;
	text-align: right;
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
	margin-right: calc(100vw * (3 / var(--design-width)));
}

.point_wrap .detail_input input.total {
	background-color: transparent;
	margin-bottom: calc(100vw * (1 / var(--design-width)));
}

.bar_tleft {
	display: flex;
	align-items: center;
	gap: calc(100vw * (7 / var(--design-width)));
}

.bar_tright .r_imgbox {
	width: calc(100vw * (34 / var(--design-width)));
	height: calc(100vw * (34 / var(--design-width)));
	border-radius: var(--common-radius);
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lang_xbtn {
	position: absolute;
	top: 0;
	right: calc(100vw * (25 / var(--design-width)));
	filter: invert(1);
	width: calc(100vw * (14 / var(--design-width)));
}

/* mypage_wrap */
.mypage_wrap .list2 .chk_row {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.mypage_wrap .list2 label {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
}

.mypage_wrap .list2 input {
	right: 5px;
}

.mypage_wrap .list2 input::before {
	content: "";
	width: calc(100vw * (46 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	border-radius: var(--out-radius);
	background-color: #D6D9E0;
	position: absolute;
	top: 50%;
	right: calc(100vw * (-5 / var(--design-width)));
	transform: translateY(-50%);
	transition: 0.5s;
}

.mypage_wrap .list2 input::after {
	content: "";
	width: calc(100vw * (21 / var(--design-width)));
	height: calc(100vw * (21 / var(--design-width)));
	border-radius: 50%;
	background-color: #FFF;
	position: absolute;
	top: 50%;
	right: calc(100vw * (21 / var(--design-width)));
	transform: translateY(-50%);
	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2);
	transition: 0.5s;
}

.mypage_wrap .list2 input[type="checkbox"]:checked::before {
	background-color: var(--main-color);
}

.mypage_wrap .list2 input[type="checkbox"]:checked::after {
	right: calc(100vw * (-6 / var(--design-width)));
}

.lang_wrap li {
	list-style: none;
}

.red_span {
	display: block;
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--caution-color);
	margin-top: calc(100vw * (5 / var(--design-width)));
}

/* phone_txt */
.phone_txt {
	line-height: 1.4;
	font-weight: 400;
	font-size: calc(100vw * (13 / var(--design-width)));
	padding-left: calc(100vw * (16 / var(--design-width)));
}

.phone_txt::before {
	content: "*";
	display: block;
	position: absolute;
	top: calc(100vw * (3 / var(--design-width)));
	left: calc(100vw * (5 / var(--design-width)));
}

.c_charge_wrap {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.charge_btn_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
	margin: calc(100vw * (20 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
}

/* charge_btn */
.charge_btn {
	display: flex;
	align-items: flex-start;
	gap: calc(100vw * (16 / var(--design-width)));
	padding: calc(100vw * (36 / var(--design-width))) calc(100vw * (10 / var(--design-width)));
	min-height: calc(100vw * (96 / var(--design-width)));
	border-radius: var(--common-radius);
	background-color: #fff;
	box-shadow: var(--btn-shadow);
}

.charge_btn.blind {
	position: relative;
	box-shadow: none;
}

.charge_btn.blind .charge_img,
.charge_btn.blind .charge_txt,
.charge_btn.blind .conv_how {
	opacity: 0.3;
}

.charge_btn.blind:after {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	border-radius: inherit;
}

.charge_btn.charge_btn2 {
	padding: calc(100vw * (36 / var(--design-width))) calc(100vw * (17 / var(--design-width)));
}

.charge_btn.hot_item {
	background-color: var(--main-color);
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (10 / var(--design-width))) calc(100vw * (10 / var(--design-width)));
}

.charge_btn.hot_item .hot {
	display: block;
}

.charge_btn.hot_item .charge_type,
.charge_btn.hot_item .charge_text {
	color: #fff !important;
}

.charge_btn .charge_txt {
	display: flex;
	flex-direction: column;
}

.charge_img {
	min-width: calc(100vw * (48 / var(--design-width)));
	min-height: calc(100vw * (48 / var(--design-width)));
	max-width: calc(100vw * (48 / var(--design-width)));
	max-height: calc(100vw * (48 / var(--design-width)));
}

/* charge_btn */
.charge_btn .hot {
	padding: calc(100vw * (4 / var(--design-width))) calc(100vw * (8 / var(--design-width)));
	border-radius: var(--out-radius);
	color: #fff;
	font-size: calc(100vw * (10 / var(--design-width)));
	font-weight: 600;
	background-color: #ffaf51;
	width: fit-content;
	display: none;
}

.charge_btn .charge_type {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	line-height: calc(100vw * (28 / var(--design-width)));
	color: var(--black-color);
}

.charge_btn .charge_text {
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	line-height: 1.6;
	color: var(--gray-color);
}

.conv_select_tit {
	color: var(--black-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

.conv_select_group {
	display: flex;
	flex-direction: column;
	margin-top: calc(100vw * (20 / var(--design-width)));
}

/* conv_select */
.conv_select {
	overflow: hidden;
	display: flex;
	align-items: center;
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (10 / var(--design-width)));
	background-color: #fff;
	border-radius: 0;
	box-shadow: unset;
	border-bottom: 1px solid var(--border-color);
	gap: calc(100vw * (20 / var(--design-width)));
}

.conv_select:after {
	content: "";
	width: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	background-image: url(../image/sub/finmo_list_view.png);
	background-size: 100% 100%;
	position: absolute;
	top: 50%;
	right: calc(100vw * (5 / var(--design-width)));
	transform: translateY(-50%);
}

.conv_icon {
	width: calc(100vw * (60 / var(--design-width)));
	display: flex;
}

.conv_name {
	color: var(--black-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

/* up_box */
.up_box .point_grid .p_num.flex_c {
	font-weight: 600;
	font-size: calc(100vw * (13 / var(--design-width)));
	color: #a8a8a8;
}

.up_box .point_grid .p_num.active.flex_c {
	color: rgba(255, 255, 255, 0.5);
}

.up_box .point_grid .p_num.flex_c span {
	font-weight: 600;
	font-size: calc(100vw * (15 / var(--design-width)));
	color: #454545;
}

.flex_c {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (3 / var(--design-width)));
}

/* up_box */
.up_box .point_grid .p_btn.active,
.up_box .point_grid .p_num.active span {
}

.up_box .up_x_btn {
	width: 100%;
	height: calc(100vw * (36 / var(--design-width)));
	background-image: url("/image/sub/up_x_btn_renew.png");
	background-size: calc(100vw * (40 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
	z-index: 11111;
}

.up_box .up_x_btn img {
	display: none;
}


.u_tit span {
	color: var(--caution-color);
	font-weight: 600;
}

.mc_line {
	width: 100vw;
	height: calc(100vw * (10 / var(--design-width)));
	background-color: #f5f5f5;
	left: calc(100vw * (-20 / var(--design-width)));
	margin-bottom: calc(100vw * (40 / var(--design-width)));
}

/* conv_logo_box */
.conv_logo_box {
	width: calc(100vw * (62 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	border-radius: 50%;
	overflow: hidden;
	border: 1px solid #eee;
	margin: calc(100vw * (10 / var(--design-width))) auto calc(100vw * (13 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
}

.conv_logo_box img {
	width: calc(100vw * (70 / var(--design-width)));
}

.conv_modal_title {
	color: var(--black-color);
	text-align: center;
	font-size: calc(100vw * (23 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

/* conv_select */
.conv_select .disable_bg {
	display: none;
}

.conv_select.disable .disable_bg {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(1px);
	z-index: 1111;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
}

.conv_select.ing {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (10 / var(--design-width))) calc(100vw * (10 / var(--design-width)));
	flex-direction: column;
	align-items: unset;
}

.conv_select_top {
	display: flex;
	align-items: center;
	gap: calc(100vw * (20 / var(--design-width)));
}

/* pay_ing */
.pay_ing {
	padding: calc(100vw * (15 / var(--design-width)));
	background-color: #f0f8fb;
	border-radius: var(--common-radius);
	color: var(--main-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.pay_ing span {
	font-size: calc(100vw * (12 / var(--design-width)));
	font-weight: 600;
	color: #fff;
	padding: calc(100vw * (4 / var(--design-width))) calc(100vw * (9 / var(--design-width)));
	border-radius: var(--out-radius);
	background-color: var(--main-color);
}

.ing_btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: calc(100vw * (8 / var(--design-width)));
}

.mc_up {
	transition: 0.5s ease-in-out;
	transform: translateY(100%);
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	z-index: 11111;
}

.conv_wrap {
	min-height: calc(100vh - calc(100vw * (60 / var(--design-width))));
	display: flex;
	flex-direction: column;
}

.conv_detail_title {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	line-height: calc(100vw * (30 / var(--design-width)));
}

/* conv_num */
.conv_num {
	padding: calc(100vw * (8 / var(--design-width))) calc(100vw * (24 / var(--design-width)));
	background-color: var(--box-bg-color);
	border-radius: var(--common-radius);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
}

.conv_num.active {
	background-color: var(--main-color);
	color: #fff;
}

/* conv_detail_box */
.conv_detail_box {
	background-color: transparent;
	border-radius: 0;
	padding: 0;
	margin-bottom: calc(100vw * (50 / var(--design-width)));
}

.conv_detail_box .conv_detail_box_1 {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	border-radius: var(--out-radius);
	background: #FFF;
	box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.12);
}

.conv_detail_box .conv_detail_box_2 {
	border-radius: var(--common-radius);
	background: var(--box-bg-color);
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width))) 0;
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	row-gap: calc(100vw * (20 / var(--design-width)));
}

.conv_detail_box .com_btn {
	width: calc(100% - (100vw * (32 / var(--design-width))));
	margin: auto;
}

.conv_detail_barcode {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (22 / var(--design-width)));
	border-radius: var(--common-radius);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	border: 0;
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	margin-bottom: calc(100vw * (30 / var(--design-width)));
	background: var(--box-bg-color);
}

.conv_bar_numbox {
	text-align: center;
	background-color: var(--black-color);
	border-radius: var(--common-radius);
	padding: calc(100vw * (17 / var(--design-width)));
	font-size: calc(100vw * (25 / var(--design-width)));
	font-weight: 600;
	color: #fff;
	margin-bottom: 0;
}

/* conv_detail_row */
.conv_detail_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
	color: var(--black-color);
	padding: 0;
	border-top: 0;
}

.conv_detail_row .conv_detail_left {
	color: var(--gray-color);
	width: calc(100vw * (110 / var(--design-width)));
}

.conv_detail_row .conv_detail_right {
	width: calc(100vw * (185 / var(--design-width)));
	text-align: right;
}

/* conv_detail_row2 */
.conv_detail_row2 .d_row2_left {
	width: calc(100vw * (110 / var(--design-width)));
	color: var(--gray-color);
}

.conv_detail_row2 .d_row2_right {
	width: calc(100vw * (185 / var(--design-width)));
	text-align: right;
}

.c_time {
	color: var(--caution-color);
}

.conv_detail_row2 {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.conv_detail_row.flex_c {
	gap: calc(100vw * (20 / var(--design-width)));
	border-bottom: 0;
}

/* conv_detail_notice */
.conv_detail_notice {
	color: var(--black-color);
	margin: calc(100vw * (40 / var(--design-width))) calc(100vw * (16 / var(--design-width))) 0;
	padding-top: 0;
}

.conv_detail_notice p {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.conv_detail_notice span {
	display: block;
	padding-left: calc(100vw * (20 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	word-break: keep-all;
	line-height: 1.4;
	margin-bottom: calc(100vw * (8 / var(--design-width)));
}

.conv_detail_notice span:last-child {
	margin-bottom: 0;
}

.conv_detail_notice span:before {
	content: "";
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	background-color: var(--black-color);
	border-radius: 100%;
	position: absolute;
	left: calc(100vw * (8 / var(--design-width)));
	top: calc(100vw * (8 / var(--design-width)));
}

.hot_item {
	flex-direction: column;
}

.hot_item2 {
	width: 100%;
	display: flex;
	align-items: center;
	gap: calc(100vw * (22 / var(--design-width)));
}

.fx-col {
	flex-direction: column;
}

.conv_now {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	background-color: #EFF6FF;
	border-radius: calc(100vw * (8 / var(--design-width)));
	padding: calc(100vw * (12 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--main-color);
	margin-bottom: calc(100vw * (-26 / var(--design-width)));
}

.cn_right {
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
}

.cn_num {
	font-size: calc(100vw * (12 / var(--design-width)));
	font-weight: 600;
	color: #fff;
	padding: calc(100vw * (4 / var(--design-width))) calc(100vw * (9 / var(--design-width)));
	border-radius: var(--out-radius);
	background-color: var(--main-color);
}

.deposit_modal .full_inner.guide_wrap,
.atm_modal .full_inner.guide_wrap {
	padding: calc(100vw * (20 / var(--design-width))) 0 0;
}

/* detail_up */
.detail_up .up_x_btn {
	z-index: 999;
	width: calc(100vw * (32 / var(--design-width)));
	height: calc(100vw * (32 / var(--design-width)));
	position: absolute;
	top: calc(100vw * (14 / var(--design-width)));
	right: calc(100vw * (16 / var(--design-width)));
	background: url("../image/sub/up_x_btn_popup.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.detail_up .up_x_btn img {
	display: none;
}

.conv_bar_img {
	max-height: calc(100vw * (50 / var(--design-width)));
}

.detail_up .conv_wrap {
	max-width: 100vw;
}

.conv_detail_top {
	padding: calc(100vw * (60 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
	max-width: 100vw;
}

.conv_detail_num {
	display: flex;
	align-items: center;
	gap: calc(100vw * (9 / var(--design-width)));
	margin-top: calc(100vw * (20 / var(--design-width)));
	overflow-x: scroll;
}

#barCode {
	max-height: calc(100vw * (50 / var(--design-width))) !important;
}

/* com_btn */
.com_btn .loading_ani .spinner {
	margin: calc(50% - 25px) auto;
	width: calc(100vw * (30 / var(--design-width)));
	height: calc(100vw * (30 / var(--design-width)));
	box-sizing: border-box;
	border: 3px solid var(--gray-color);
	border-top-color: var(--black-color);
	border-radius: 50%;
	animation: load-spin 1.5s ease-in-out infinite;
	margin-left: calc(100vw * (110 / var(--design-width)));
}

.com_btn .loading_ani::after {
	position: relative;
	content: "입금대기중";
	position: absolute;
	top: 50%;
	left: calc(50% + (100vw * (20 / var(--design-width))));
	transform: translate(-50%, -50%);
	color: var(--gray-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	display: none;
}

@keyframes load-spin {
	100% {
		transform: rotate(360deg);
	}
}

/* com_btn */
.com_btn .loading_ani {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
}

.com_btn .loading_ani .loading_txt {
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
}

.com_btn .loading_ani .loading_txt dotlottie-player {
	width: calc(100vw * (30 / var(--design-width)));
	height: calc(100vw * (30 / var(--design-width)));
}

.com_btn .loading_ani .loading_txt span {
	color: var(--gray-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

.com_slideup {
	z-index: 100000;
	max-height: 90vh;
	background-color: var(--white-color);
	border-radius: var(--out-radius) var(--out-radius) 0 0;
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	transition: 0.5s;
}

/* slideup_xbtn */
.slideup_xbtn {
	z-index: 999;
	width: calc(100vw * (14 / var(--design-width)));
	position: absolute;
	top: calc(100vw * (31 / var(--design-width)));
	right: calc(100vw * (22 / var(--design-width)));
	width: 100%;
	height: calc(100vw * (36 / var(--design-width)));
	background-image: url(../image/sub/up_x_btn_renew.png);
	background-size: calc(100vw * (40 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
	top: 0;
	right: 0;
}

.slideup_xbtn img {
	display: none;
}

.com_slideup .slide_title {
	color: var(--black-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4;
}

.slide_infolist {
	margin: calc(100vw * (20 / var(--design-width))) 0;
}

/* com_slideup */
.com_slideup .slide_list {
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
	line-height: 1.4;
	padding-left: calc(100vw * (20 / var(--design-width)));
	word-break: keep-all;
	overflow-wrap: anywhere;
	margin-bottom: calc(100vw * (5 / var(--design-width)));
}

.com_slideup .slide_list:before {
	content: "";
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	background-color: var(--gray-color);
	border-radius: 100%;
	position: absolute;
	left: calc(100vw * (8 / var(--design-width)));
	top: calc(100vw * (8 / var(--design-width)));
}

.com_slideup .slide_list.bold {
	color: #111;
	font-weight: 600;
}

.com_slideup .slide_list.list_highlight {
	color: var(--black-color);
}

.com_slideup .slide_list.list_highlight:before {
	background-color: var(--black-color);
}

/* STYLE_USD */
#STYLE_USD .p_num {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#STYLE_USD .p_num br {
	display: none;
}

#STYLE_USD .p_num span {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	margin-top: calc(100vw * (-10 / var(--design-width)));
}

/* STYLE_CNY */
#STYLE_CNY .p_num {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#STYLE_CNY .p_num br {
	display: none;
}

#STYLE_CNY .p_num span {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	margin-top: calc(100vw * (-20 / var(--design-width)));
}

.join02_group {
	margin-top: calc(100vw * (40 / var(--design-width)));
}

/* sign_group */
.sign_group {
	display: flex;
	flex-direction: column;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.sign_group .input_tit {
	color: var(--gray-color);
	text-indent: calc(100vw * (5 / var(--design-width)));
}

.sign_group input {
	padding: calc(100vw * (14 / var(--design-width)));
	border-radius: var(--common-radius);
	background-color: #fff;
	width: 100%;
	margin-top: calc(100vw * (8 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	min-height: calc(100vw * (52 / var(--design-width)));
}

.sign_group.certcode {
	display: none;
}

/* password_modal */
.password_modal {
	position: fixed;
	width: 100%;
	bottom: 0;
	left: 0;
	background-color: var(--background-color);
	border-radius: var(--out-radius) var(--out-radius) 0 0;
	padding-top: calc(100vw * (20 / var(--design-width)));
	height: 100vh;
	display: flex;
	flex-direction: column;
	transition: 0.5s;
	transform: translateY(100%);
}

.password_modal .num_pad {
	margin-top: auto;
}

.password_modal .title {
	margin-top: calc(100vw * (40 / var(--design-width)));
	text-align: center;
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (40 / var(--design-width)));
}

.password_modal .pw_xbtn {
	position: absolute;
	width: calc(100vw * (16 / var(--design-width)));
	top: calc(100vw * (20 / var(--design-width)));
	right: calc(100vw * (20 / var(--design-width)));
}

.error_txt {
	margin-top: calc(100vw * (8 / var(--design-width)));
	padding-left: calc(100vw * (6 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
}

/* guide title */
.p_guide_title {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: calc(100vw * (10 / var(--design-width)));
}

.p_guide_title .g_logo2 {
	width: calc(100vw * (76 / var(--design-width)));
	margin: calc(100vw * (36 / var(--design-width))) auto;
}

.p_guide_title .g_logo {
	width: calc(100vw * (268 / var(--design-width)));
	margin: calc(100vw * (36 / var(--design-width))) auto;
}

.pg_title {
	font-size: calc(100vw * (22 / var(--design-width)));
	font-weight: 600;
	color: #292929;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	padding-left: calc(100vw * (16 / var(--design-width)))
}

/* pg_txt */
.pg_txt {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
	line-height: 140%;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.pg_txt span {
	font-weight: 600;
}

.s1_arrow {
	display: inline-block;
	position: relative;
	top: 28px;
	margin-left: -10px;
	text-align: center;
	animation: arrow_down 1.5s infinite;
}

/* scroll-arrow */
.scroll-arrow {
	width: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	border-right: 3px solid #454b57;
	border-bottom: 3px solid #454b57;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	animation: arrow-wave 1.5s infinite linear;
}

.scroll-arrow:nth-child(1) {
	animation-delay: 0;
}

.scroll-arrow:nth-child(2) {
	animation-delay: .3s;
}

@keyframes arrow-wave {
	0% {
		opacity: 0;
	}

	30% {
		opacity: 0.5;
	}

	60% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

/* guide_wrap */
.guide_wrap .com_btn {
	margin: calc(100vw * (50 / var(--design-width))) calc(100vw * (25 / var(--design-width))) 0;
}

.guide_wrap .guide_inner {
	margin-top: calc(100vw * (50 / var(--design-width)));
}

.g_section {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: calc(100vw * (15 / var(--design-width)));
	margin-top: calc(100vw * (40 / var(--design-width)));
}

/* gs_num */
.gs_num {
	width: calc(100vw * (38 / var(--design-width)));
	height: calc(100vw * (38 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: #fff;
	padding: calc(100vw * (12 / var(--design-width)));
	background-color: #ff8383;
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
}

.gs_num.pay_guide {
	background-color: var(--main-color);
	padding: calc(100vw * (10 / var(--design-width)));
}

.gs_title {
	font-size: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
	color: #292929;
}

/* gs_tit */
.gs_tit {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
	color: #97979e;
	line-height: normal;
}

.gs_tit span {
	font-weight: 600;
}

.gs_img {
	margin: 0 calc(100vw * (-16 / var(--design-width)));
}

.conv_how {
	position: absolute;
	top: calc(100vw * (10 / var(--design-width)));
	right: calc(100vw * (10 / var(--design-width)));
	background-color: transparent;
	padding: calc(100vw * (6 / var(--design-width))) calc(100vw * (10 / var(--design-width)));
	border-radius: var(--out-radius);
	font-size: calc(100vw * (12 / var(--design-width)));
	z-index: 33;
	color: var(--black-color);
	border: 1px solid var(--border-color);
}

/* full_modal */
.full_modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	z-index: 999;
	transform: translateY(100%);
	transition: 0.5s;
}

.full_modal .bg {
	background-color: rgba(0, 0, 0, 0.5);
	width: 100vw;
	height: 200vh;
	position: absolute;
	top: -100vh;
	left: 0;
	display: none;
}

.full_inner {
	padding: calc(100vw * (50 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
	background-color: #fff;
	height: 100%;
	max-height: 100vh;
	overflow-y: scroll;
}

.full_inner.guide_wrap {
	padding-bottom: calc(100vw * (70 / var(--design-width)));
}

.full_modal .up_x_btn {
	display: block;
	z-index: 111;
	position: absolute;
	top: calc(100vw * (14 / var(--design-width)));
	right: calc(100vw * (16 / var(--design-width)));
    width: calc(100vw * (32 / var(--design-width)));
    height: calc(100vw * (32 / var(--design-width)));
    background: var(--black-color);
    mask: url(../image/common/icon_xbtn.svg) no-repeat center / contain;
    -webkit-mask: url(../image/common/icon_xbtn.svg) no-repeat center / contain;
}

.full_modal .up_x_btn img {
	display: none;
}

/* 편의점 이용 안내 */
.p_guide_tab_group {
	display: flex;
	gap: calc(100vw * (24 / var(--design-width)));
	align-items: center;
	overflow-x: scroll;
	overflow-y: hidden;
	height: calc(100vw * (65 / var(--design-width)));
	padding: 0 calc(100vw * (16 / var(--design-width)));
	flex-shrink: 0;
}

.p_guide_tab_group .p_guide_tab {
	white-space: nowrap;
	line-height: calc(100vw * (24 / var(--design-width)));
	font-size: calc(100vw * (21 / var(--design-width)));
	color: var(--gray-color);
	font-weight: 600;
	opacity: 0.5;
}

.p_guide_tab_group .p_guide_tab.active {
	color: var(--main-color);
	border-bottom: 0;
	opacity: 1;
}

.guide_img_box {
	overflow: scroll;
	display: none;
}

.cu_guide,
.gs_atm_guide {
	display: block;
}

.detail_up {
	position: fixed;
	top: 0;
	left: 0;
	transform: translateY(100%);
	transition: 0.5s;
	background-color: var(--background-color);
	height: 100vh;
	overflow: scroll;
	z-index: 102;
}

/* conv_bar_title */
.conv_bar_title {
	color: var(--black-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.conv_bar_title span {
	max-width: calc(100vw * (230 / var(--design-width)));
}

.canclebtn_pointnow {
	font-size: calc(100vw * (12 / var(--design-width)));
	color: #fff;
	border-radius: var(--out-radius);
	padding: calc(100vw * (4 / var(--design-width))) calc(100vw * (8 / var(--design-width)));
	background-color: var(--caution-color);
	max-width: calc(100vw * (100 / var(--design-width)));
	text-align: center;
	line-height: 1.2;
}

.charge_subtxt {
	font-size: calc(100vw * (12 / var(--design-width)));
	font-weight: 400;
	color: #999;
}

.prepaid_wrap {
	background-color: var(--background-color);
	min-height: calc(100vh - calc(100vw * (60 / var(--design-width))));
}

.prepaid_top {
	padding: 0 calc(100vw * (25 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
	margin: calc(100vw * (35 / var(--design-width))) 0 0;
}

.pre_top_btn {
	display: flex;
	gap: calc(100vw * (24 / var(--design-width)));
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	line-height: calc(100vw * (24 / var(--design-width)));
	color: rgba(70, 70, 70, 0.5);
}

.pre_btn.active {
	color: var(--main-color);
	border-bottom: 2px solid var(--main-color);
	padding-bottom: calc(100vw * (2 / var(--design-width)));
}

.pre_box {
	margin-top: calc(100vw * (22 / var(--design-width)));
	border-radius: var(--out-radius);
	overflow: hidden;
	border: 1px solid var(--main-color);
}

.pre_boxtop {
	padding: calc(100vw * (20 / var(--design-width)));
	background-color: var(--main-color);
	color: #fff;
}

.pre_boxtit {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (5 / var(--design-width)));
}

/* pre_inputbox */
.pre_inputbox .pre_input_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (5 / var(--design-width)));
	justify-content: center;
	margin-top: calc(100vw * (5 / var(--design-width)));
}

.pre_inputbox input {
	background-color: #f9f9f9;
	border-radius: var(--common-radius);
	width: calc(100vw * (79 / var(--design-width)));
	text-align: center;
	padding: calc(100vw * (11 / var(--design-width))) 0;
}

.pre_inputtit {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
}

.prepaid_bottom {
	border-radius: var(--out-radius) var(--out-radius) 0 0;
	background-color: #fff;
	padding: calc(100vw * (35 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
}

.pre_cash {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
}

.pre_cash_num {
	border-radius: var(--common-radius);
	background-color: #f9f9f9;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(100vw * (10 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
	margin-top: calc(100vw * (10 / var(--design-width)));
	margin-bottom: calc(100vw * (40 / var(--design-width)));
}

.pre_charge {
	padding: calc(100vw * (10 / var(--design-width))) calc(100vw * (18 / var(--design-width)));
	background-color: #595a5b;
	color: #fff;
	border-radius: var(--common-radius);
}

.pre_num {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	display: flex;
	gap: calc(100vw * (3 / var(--design-width)));
}

/* prepaid_wrap */
.prepaid_wrap .cash_select {
	background-color: #fff;
	color: #111;
	border: 1px solid #808080;
	border-radius: var(--common-radius);
	padding: calc(100vw * (14 / var(--design-width))) calc(100vw * (17 / var(--design-width)));
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	box-sizing: border-box;
	width: calc(100vw * (103 / var(--design-width)));
}

.prepaid_wrap .cash_select.active {
	border: none;
	background-color: var(--main-color);
	color: #fff;
	font-weight: 600;
}

.prepaid_select {
	margin-top: calc(100vw * (10 / var(--design-width)));
	display: flex;
	gap: calc(100vw * (8 / var(--design-width)));
	flex-wrap: wrap;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.prepaid_txt_sml {
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	line-height: calc(100vw * (21 / var(--design-width)));
	color: #909090;
	margin-bottom: calc(100vw * (30 / var(--design-width)));
	padding-bottom: calc(100vw * (30 / var(--design-width)));
	border-bottom: 1px solid #eee;
}

/* pre_txt_sml */
.pre_txt_sml {
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	line-height: calc(100vw * (21 / var(--design-width)));
	color: #909090;
}

.pre_txt_sml:nth-child(3) {
	padding-left: calc(100vw * (6 / var(--design-width)));
}

.modal_image.unable {
	opacity: 0.1;
}

.pre_inputbox {
	padding: calc(100vw * (20 / var(--design-width)));
	background-color: #fff;
	display: flex;
	flex-direction: column;
}

.pre_chk_btn {
	background-color: #595A5B;
	border-radius: var(--out-radius);
	padding: calc(100vw * (10 / var(--design-width))) calc(100vw * (31 / var(--design-width)));
	color: #fff;
	width: fit-content;
	margin: calc(100vw * (20 / var(--design-width))) auto 0;
}

.cs_number {
	text-align: center;
	margin-top: calc(100vw * (20 / var(--design-width)));
	color: #909090;
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
}

.pre_detail_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
	margin-top: calc(100vw * (32 / var(--design-width)));
	padding-bottom: calc(100vw * (24 / var(--design-width)));
	border-bottom: 1px solid #eee;
}

.pre_detail_row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

.pre_row_tit {
	color: #a3a3a3;
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 400;
}

/* pre_row_right */
.pre_row_right {
	font-size: calc(100vw * (15 / var(--design-width)));
	max-width: calc(100vw * (210 / var(--design-width)));
	text-align: right;
	word-break: keep-all;
}

.pre_row_right.fail {
	color: var(--caution-color);
}

.pre_row_right.bold {
	font-weight: 600;
}

.prepaid_wrap select {
	background-image: url(../image/sub/filter_under.png);
	background-position: center right;
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-color: transparent;
}

.prepaid_list {
	padding: calc(100vw * (10 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
}

.pr_listtop {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.pr_list {
	background-color: #fff;
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
	border-radius: var(--common-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
}

/* pr_row */
.pr_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.pr_row.row1 .pr_cash {
	font-size: calc(100vw * (17 / var(--design-width)));
	font-weight: 600;
}

.pr_row.row1 {
	font-size: calc(100vw * (15 / var(--design-width)));
}

.pr_row.row2 {
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	color: #999;
}

.pr_row.row2 .pr_status {
	color: var(--main-color);
}

.pr_row.row2 .pr_status.fail {
	color: var(--caution-color);
}

.pr_list_group {
	margin-top: calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (10 / var(--design-width)));
}

/* prepaid_bottom_modal */
.prepaid_bottom_modal {
	position: fixed;
	width: 100%;
	bottom: 0;
	left: 0;
	transform: translateY(100%);
	transition: 0.5s;
}

.prepaid_bottom_modal .bg {
	width: 100%;
	height: 200vh;
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
	display: none;
}

.prepaid_bottom_modal .up_x_btn {
	width: calc(100vw * (14 / var(--design-width)));
	top: calc(100vw * (20 / var(--design-width)));
	right: calc(100vw * (20 / var(--design-width)));
	position: absolute;
	z-index: 999;
}

.pr_total span {
	font-weight: 600;
}

/* contact_wrap */
.contact_wrap .contact_switch {
	display: flex;
	position: fixed;
	top: calc(100vw * (60 / var(--design-width)));
	left: 0;
	z-index: 100;
	background-color: var(--background-color);
	width: 100%;
}

.contact_wrap .contact_switch .switch {
	flex: 1;
	text-align: center;
	color: #999;
	font-size: calc(100vw * (17 / var(--design-width)));
	font-weight: 600;
	line-height: calc(100vw * (24 / var(--design-width)));
	padding: calc(100vw * (14 / var(--design-width))) 0;
	border-bottom: 1px solid var(--border-color);
	min-height: calc(100vw * (54 / var(--design-width)));
}

.contact_wrap .contact_switch .switch.active {
	color: var(--black-color);
	font-weight: 600;
	border-bottom: 2px solid var(--black-color);
}

.etc_wrap {
	padding: 0;
	padding-top: calc(100vw * (130 / var(--design-width)));
}

.etc_content_box {
	padding: 0 calc(100vw * (20 / var(--design-width))) 0;
}

/* pre_box */
.pre_box .pre_ok_box {
	border-radius: var(--common-radius);
	background: #F9F9F9;
	padding: calc(100vw * (20 / var(--design-width)));
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.pre_box .pre_ok_box .tit {
	border-bottom: 1px solid #ddd;
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
	padding-bottom: calc(100vw * (10 / var(--design-width)));
}

.pre_box .pre_ok_box table {
	width: 100%;
}

.pre_box .pre_ok_box table th {
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	text-align: left;
	padding-top: calc(100vw * (10 / var(--design-width)));
}

.pre_box .pre_ok_box table td {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	text-align: right;
	padding-top: calc(100vw * (10 / var(--design-width)));
}

/* e_item */
.e_item.end_day .s3_item img {
	filter: brightness(0.5);
}

.e_item.end_day .s3_item::after {
	content: "종료";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	width: fit-content;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.e_item.end_day .right .ei_title,
.e_item.end_day .right .ei_tit {
	color: #999;
}

.pre_chk_btn.unable {
	background-color: #d6d6d6;
}

/* com_btn */
.com_btn.verify_btn {
	background-color: var(--black-color);
	color: #fff;
	margin-top: calc(100vw * (12 / var(--design-width)));
	width: 100%;
}

.com_btn.verify_ing {
	background-color: #ff8383;
}

.kyc_wrap {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
}

/* kyc_section */
.kyc_section {
	margin-bottom: calc(100vw * (50 / var(--design-width)));
}

.kyc_section:nth-last-of-type(1) {
	margin-bottom: calc(100vw * (0 / var(--design-width)));
}

.kyc_title_group {
	display: flex;
	align-items: center;
}

.kyc_num {
	padding: calc(100vw * (5 / var(--design-width))) calc(100vw * (7 / var(--design-width)));
	font-size: calc(100vw * (17 / var(--design-width)));
	font-weight: 600;
	color: #fff;
	background-color: #3c414c;
	border-radius: var(--common-radius);
	font-weight: 600;
}

.kyc_title {
	padding: calc(100vw * (5 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	background-color: #d6d9e0;
	color: #3c414c;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
	margin-left: calc(100vw * (-4 / var(--design-width)));
	border-radius: var(--common-radius);
}

.kyc_subtitle {
	margin: calc(100vw * (14 / var(--design-width))) 0;
	color: var(--black-color);
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	letter-spacing: -0.05em;
}

.kyc_subtit {
	color: var(--gray-color);
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 400;
	margin-bottom: calc(100vw * (40 / var(--design-width)));
}

.kyc_img_box {
}

.kyc_wrap .com_btn {
	width: 100%;
}

/* kyc_img */
.kyc_img {
	margin: calc(100vw * (20 / var(--design-width))) auto calc(100vw * (20 / var(--design-width)));
}

.kyc_img.img_id_card {
	width: calc(100vw * (208 / var(--design-width)));
}

.kyc_img.img_selfie {
	width: calc(100vw * (166 / var(--design-width)));
}

.kyc_img.img_passport {
	width: calc(100vw * (196 / var(--design-width)));
}

/* kyc_text */
.kyc_text {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	color: var(--gray-color);
	line-height: normal;
	margin-top: calc(100vw * (6 / var(--design-width)));
	position: relative;
	padding-left: calc(100vw * (16 / var(--design-width)));
}

.kyc_text::before {
	content: "";
	display: inline-block;
	position: absolute;
	top: calc(100vw * (8 / var(--design-width)));
	left: calc(100vw * (5 / var(--design-width)));
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	background: var(--gray-color);
	border-radius: var(--common-radius);
}

.kyc_text span {
	color: var(--black-color);
	font-weight: 600;
}

.kyc_ing {
	display: flex;
	align-items: center;
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.ing_label {
	padding: calc(100vw * (5 / var(--design-width))) calc(100vw * (10 / var(--design-width)));
	background-color: transparent;
	border-radius: var(--out-radius);
	color: var(--main-color);
	font-size: calc(100vw * (12 / var(--design-width)));
	margin-right: calc(100vw * (12 / var(--design-width)));
	border: 1px solid var(--main-color);
}

.ing_date {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	line-height: calc(100vw * (23 / var(--design-width)));
	color: var(--black-color);
}

/* ing_btn2 */
.ing_btn2 {
	color: var(--gray-color);
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	display: flex;
	align-items: center;
	column-gap: calc(100vw * (7 / var(--design-width)));
	margin-left: auto;
}

.ing_btn2 img {
	width: calc(100vw * (17 / var(--design-width)));
}

/* check_modal */
.check_modal .check_modal_img {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (10 / var(--design-width)));
}

.check_modal .check_modal_txt {
	font-size: calc(100vw * (12 / var(--design-width)));
	color: var(--gray-color);
	text-align: center;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: calc(100vw * (-0.24 / var(--design-width)));
	margin-bottom: calc(100vw * (14 / var(--design-width)));
}

/* country_num_modal */
.country_num_modal {
	transform: translateY(200%);
}

.country_num_modal .bg {
	height: 300vh;
}

.country_num_list_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (10 / var(--design-width)));
	padding-top: calc(100vw * (30 / var(--design-width)));
}

.country_num_list {
	display: flex;
	padding: calc(100vw * (10 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	align-items: center;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	line-height: 1.6em;
}

.list_r_arw {
	width: calc(100vw * (10 / var(--design-width)));
	margin-left: auto;
}

/* sml_red_txt */
.sml_red_txt {
	margin-top: calc(100vw * (6 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
	color: #f00;
	opacity: 1;
	width: 100%;
	height: calc(100vw * (15 / var(--design-width)));
}

.sml_red_txt.on {
	opacity: 1;
}

/* plus_have */
.plus_have {
	padding: calc(100vw * (20 / var(--design-width)));
	border-radius: var(--common-radius);
	background-color: var(--sub-color);
	color: #fff;
	display: flex;
	flex-direction: row;
	gap: calc(100vw * (6 / var(--design-width)));
	justify-content: space-between;
	align-items: center;
	margin-top: calc(100vw * (80 / var(--design-width)));
}

.plus_have .have_title {
	font-size: calc(100vw * (16 / var(--design-width)));
}

.plus_have span {
	font-size: calc(100vw * (27 / var(--design-width)));
	font-weight: 600;
}

.plus_have span .unit {
	font-weight: 400;
	margin-left: calc(100vw * (2 / var(--design-width)));
}

/* howto_box */
.howto_box {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background: #ebebf1;
	border-radius: var(--common-radius);
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.howto_box .howto_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	text-decoration: underline;
	font-weight: 600;
	margin-bottom: calc(100vw * (8 / var(--design-width)));
	padding-left: calc(100vw * (18 / var(--design-width)));
}

.howto_box .howto_title::before {
	content: "";
	width: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: url(../image/sub/mark_icon.png);
	position: absolute;
	top: 50%;
	right: 0;
	left: 0;
	transform: translateY(-50%);
}

.howto_box .howto_txt {
	color: var(--gray-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.5;
	word-break: keep-all;
}

.howto_box .howto_txt span {
	font-weight: 600;
}

/* phone_switch */
.phone_switch {
	display: flex;
	align-items: center;
	gap: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: rgba(70, 70, 70, 0.5);
	margin-top: calc(100vw * (35 / var(--design-width)));
	padding: 0 calc(100vw * (25 / var(--design-width)));
}

.phone_switch .switch {
	line-height: 1.5em;
}

.phone_switch .switch.active {
	color: var(--main-color);
	border-bottom: 2px solid var(--main-color);
}

.phone_wrap {
	flex: 1;
	background-color: #fff;
	display: flex;
	flex-direction: column;
}

/* phone_slider */
.phone_slider {
	width: 100%;
	height: calc(100vw * (360 / var(--design-width)));
}

.phone_slider .swiper-slide {
	width: 100%;
}

/* phone-pagination */
.phone-pagination {
	z-index: 2;
	width: 100%;
	position: absolute;
	bottom: calc(100vw * (10 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
}

.phone-pagination .swiper-pagination-bullet-active {
	background-color: #454b57 !important;
}

.phone_info {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
}

.phone_brand {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	line-height: 1.5em;
	color: var(--main-color);
}

.phone_title {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	line-height: 1.5em;
	word-break: keep-all;
	margin-top: calc(100vw * (15 / var(--design-width)));
}

/* phone_sub */
.phone_sub {
	display: flex;
	font-size: calc(100vw * (14 / var(--design-width)));
	gap: calc(100vw * (6 / var(--design-width)));
	align-items: center;
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.phone_sub .sub_line {
	width: 1px;
	height: calc(100vw * (12 / var(--design-width)));
	background-color: #ddd;
}

.sub_txt1 {
	color: var(--main-color);
	font-weight: 600;
}

/* sub_txt2 */
.sub_txt2 {
	font-weight: 400;
}

.sub_txt2 span {
	font-weight: 600;
}

.phone_wrap .section_line {
	height: calc(100vw * (10 / var(--design-width)));
	width: 100%;
	background-color: #f5f5f5;
	border-top: 1px solid #e2e2e2;
}

.phone_detail {
	padding: calc(100vw * (25 / var(--design-width)));
	padding-bottom: calc(100vw * (80 / var(--design-width)));
}

.phone_buy_top {
	padding: calc(100vw * (40 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
}

.phone_buy_info {
	display: flex;
	gap: calc(100vw * (10 / var(--design-width)));
}

.phone_buy_img {
	min-width: calc(100vw * (140 / var(--design-width)));
	max-width: calc(100vw * (140 / var(--design-width)));
}

.phone_buy_type {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--main-color);
	font-weight: 600;
	line-height: 1.5em;
}

.phone_buy_title {
	margin: calc(100vw * (8 / var(--design-width))) 0 calc(100vw * (15 / var(--design-width)));
	font-size: calc(100vw * (20 / var(--design-width)));
	color: #111;
	font-weight: 600;
	line-height: 1.3em;
}

.phone_buy_btn {
	display: flex;
	align-items: center;
	gap: calc(100vw * (5 / var(--design-width)));
}

.phone_but_button {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--common-radius);
	color: #fff;
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	background-color: var(--main-color);
	padding: calc(100vw * (11 / var(--design-width)));
}

.phone_more {
	min-width: calc(100vw * (20 / var(--design-width)));
	max-width: calc(100vw * (20 / var(--design-width)));
}

/* phone_more_pop */
.phone_more_pop {
	padding: calc(100vw * (20 / var(--design-width)));
	border-radius: var(--common-radius);
	box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.08);
	position: absolute;
	top: 80%;
	right: 0;
	width: calc(100vw * (280 / var(--design-width)));
	z-index: 10;
	background-color: #fff;
	font-size: calc(100vw * (14 / var(--design-width)));
	display: none;
}

.phone_more_pop span {
	font-weight: 600;
	color: var(--black-color);
}

.pop_xbtn {
	width: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	padding: calc(100vw * (4 / var(--design-width)));
	position: absolute;
	top: calc(100vw * (5 / var(--design-width)));
	right: calc(100vw * (5 / var(--design-width)));
}

/* phone_buy_top_box */
.phone_buy_top_box {
	padding: calc(100vw * (20 / var(--design-width)));
	background-color: #f9f9f9;
	border-radius: var(--common-radius);
	display: flex;
	justify-content: space-between;
	font-size: calc(100vw * (14 / var(--design-width)));
	margin-top: calc(100vw * (40 / var(--design-width)));
}

.phone_buy_top_box .box_left {
	color: #a8a8a8;
	font-weight: 600;
}

.phone_buy_top_box .box_right {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: calc(100vw * (10 / var(--design-width)));
}

.phone_buy_inner {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
}

.phone_buy_subtitle {
	color: #595a5b;
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
}

.phone_buy_subtitle2 {
	color: var(--black-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	margin: calc(100vw * (40 / var(--design-width))) 0 calc(100vw * (12 / var(--design-width)));
}

/* phone_buy_select */
.phone_buy_select {
	width: 100%;
	height: calc(100vw * (59 / var(--design-width)));
	font-size: calc(100vw * (17 / var(--design-width)));
	font-weight: 600;
	padding: calc(100vw * (20 / var(--design-width)));
	background-color: #f9f9f9;
	border-radius: var(--common-radius);
	margin-top: calc(100vw * (10 / var(--design-width)));
	display: flex;
	align-items: center;
}

.phone_buy_select img {
	width: calc(100vw * (12 / var(--design-width)));
	margin-left: auto;
}

.phone_buy_select .file_name {
	font-size: calc(100vw * (17 / var(--design-width)));
	color: rgba(70, 70, 70, 0.5);
	max-width: calc(100vw * (195 / var(--design-width)));
}

.phone_buy_select input {
	background-color: transparent;
	display: none;
}

.phone_buy_select label {
	width: calc(100vw * (86 / var(--design-width)));
	padding: calc(100vw * (10 / var(--design-width)));
	background-color: #595a5b;
	border-radius: var(--common-radius);
	color: #fff;
	font-size: calc(100vw * (14 / var(--design-width)));
	margin-left: auto;
}

/* phone_buy_deatil_box */
.phone_buy_deatil_box {
	background-color: #f9f9f9;
	padding: calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
	margin-top: calc(100vw * (30 / var(--design-width)));
	border-radius: var(--common-radius);
	font-size: calc(100vw * (14 / var(--design-width)));
}

.phone_buy_deatil_box .phone_detail_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.phone_buy_deatil_box .detail_title {
	color: #777;
}

.phone_buy_deatil_box span {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
}

.phone_buy_deatil_box p {
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
}

/* phone_buy_subtit */
.phone_buy_subtit {
	text-align: center;
	color: var(--gray-color);
	font-weight: 600;
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.5em;
	max-width: calc(100vw * (240 / var(--design-width)));
	margin: 0 auto;
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.phone_buy_subtit span {
	font-weight: 600;
	line-height: 1.5em;
	color: var(--caution-color);
}

/* phone_modal_list_group */
.phone_modal_list_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
	margin-top: calc(100vw * (40 / var(--design-width)));
}

.phone_modal_list_group .phone_modal_list {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	padding-bottom: calc(100vw * (10 / var(--design-width)));
	border-bottom: 1px solid #dfdfdf;
	line-height: 1.2em;
}

.phone_modal_list_group .active {
	font-weight: 600;
}

.phone_buy_input {
	padding: calc(100vw * (16 / var(--design-width))) calc(100vw * (23 / var(--design-width)));
	border-radius: var(--common-radius);
	background-color: #ebebf1;
	width: 100%;
	margin-top: calc(100vw * (10 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

/* phone_arim_box */
.phone_arim_box {
	padding: calc(100vw * (20 / var(--design-width)));
	background-color: #fafafc;
	border: 1px solid #eee;
	border-radius: var(--common-radius);
	display: flex;
	flex-direction: column;
}

.phone_arim_box span {
	color: #454545;
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	line-height: 1.5em;
}

.phone_arim_tit {
	color: #454545;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.phone_buy_subtxt {
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	line-height: 1.5em;
	color: var(--gray-color);
	margin: calc(100vw * (10 / var(--design-width))) 0 calc(100vw * (40 / var(--design-width)));
}

.phone_buy_inner .com_btn {
	width: 100%;
}

.phone_list_group {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.phone_list_empty {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(0,0,0,0.7);
	font-size: calc(100vw * (16 / var(--design-width)));
}

/* phone_list */
.phone_list {
	padding: calc(100vw * (25 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (7 / var(--design-width)));
}

.phone_list::before {
	content: "";
	width: 100vw;
	height: calc(100vw * (10 / var(--design-width)));
	background-color: #f5f5f5;
	border-top: 1px solid #e2e2e2;
	position: absolute;
	top: 0;
	left: 0;
}

.phone_list:first-child::before {
	display: none;
}

/* phone_list_top */
.phone_list_top {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.phone_list_top .phone_date {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
}

.phone_list_top .phone_order_detail {
	font-size: calc(100vw * (12 / var(--design-width)));
	font-weight: 400;
	color: #999;
	display: flex;
	gap: calc(100vw * (5 / var(--design-width)));
	align-items: center;
}

.phone_list_top .phone_order_detail img {
	width: calc(100vw * (5 / var(--design-width)));
	opacity: 0.5;
}

.phone_list_box {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (17 / var(--design-width))) calc(100vw * (17 / var(--design-width)));
	border: 1px solid #808080;
	background-color: #fff;
	border-radius: var(--common-radius);
}

/* phone_box_top */
.phone_box_top {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	display: flex;
	align-items: center;
	color: rgba(70, 70, 70, 0.2);
	gap: calc(100vw * (5 / var(--design-width)));
}

.phone_box_top .phone_now {
	color: var(--black-color);
}

.phone_box_top .phone_delivery {
	color: var(--main-color);
}

/* phone_box_mid */
.phone_box_mid {
	display: flex;
	align-items: center;
	gap: calc(100vw * (20 / var(--design-width)));
	margin: calc(100vw * (15 / var(--design-width))) 0;
}

.phone_box_mid .phone_thumb {
	max-width: calc(100vw * (55 / var(--design-width)));
	min-width: calc(100vw * (55 / var(--design-width)));
}

.phone_box_mid .phone_model {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (5 / var(--design-width)));
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	line-height: 1.3em;
}

.phone_box_bottom {
	display: flex;
	align-items: center;
	padding: calc(100vw * (7 / var(--design-width)));
	width: 100%;
	color: #a8a8a8;
	font-weight: 400;
	border-radius: var(--common-radius);
	background-color: #f9f9f9;
	font-size: calc(100vw * (12 / var(--design-width)));
	gap: calc(100vw * (5 / var(--design-width)));
}

.phone_btn_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (8 / var(--design-width)));
	margin-top: calc(100vw * (10 / var(--design-width)));
}

/* phone_btn */
.phone_btn {
	flex: 1;
	border: 1px solid #ccc;
	border-radius: 12;
	height: calc(100vw * (40 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--common-radius);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.phone_btn.request {
	border-color: #59A8C8;
	color: #59A8C8;
}

.phone_wrap .com_btn.fixed {
	width: unset;
	position: fixed;
	bottom: calc(100vw * (20 / var(--design-width)));
	left: calc(100vw * (25 / var(--design-width)));
	right: calc(100vw * (25 / var(--design-width)));
	margin-bottom: 0;
}

.subway_wrap {
	flex: 1;
	padding: 0 calc(100vw * (16 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
}

/* subway_top */
.subway_top {
	background-image: url(../image/sub/subway_img.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: right;
	height: calc(100vw * (152 / var(--design-width)));
	margin-right: calc(100vw * (-16 / var(--design-width)));
	padding-left: calc(100vw * (8 / var(--design-width)));
}

.subway_top.conv_top_bg {
	background-image: url(../image/sub/conv_bg.png);
	background-size: calc(100vw * (200 / var(--design-width)));
}

/* subway_title */
.subway_title {
	padding-top: calc(100vw * (41 / var(--design-width)));
	display: flex;
	flex-direction: column;
	font-size: calc(100vw * (28 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4em;
	margin-bottom: calc(100vw * (6 / var(--design-width)));
	max-width: calc(100vw * (175 / var(--design-width)));
}

.subway_title span {
	color: var(--main-color);
}

/* sub_wrap */
.sub_wrap.subway_wrap2 {
	gap: 0;
}

.sub_wrap.subway_wrap2 .subway_title {
	padding-top: calc(100vw * (30 / var(--design-width)));
	max-width: calc(100vw * (145 / var(--design-width)));
}

.sub_wrap.subway_wrap2 .subway_tit {
	max-width: calc(100vw * (145 / var(--design-width)));
}

.subway_tit {
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.4em;
	color: var(--gray-color);
	font-weight: 400;
	max-width: calc(100vw * (175 / var(--design-width)));
}

.subway_list_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (10 / var(--design-width)));
}

/* subway_list */
.subway_list {
	height: calc(100vw * (86 / var(--design-width)));
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: var(--common-radius);
	font-size: calc(100vw * (20 / var(--design-width)));
	line-height: 1.4em;
	font-weight: 600;
	box-shadow: 2px 3px 8px -2px rgba(101, 113, 131, 0.15);
}

.subway_list span {
	display: flex;
	align-items: center;
	gap: calc(100vw * (20 / var(--design-width)));
	max-width: calc(100vw * (375 / var(--design-width)));
}

.subway_list span img {
	width: calc(100vw * (60 / var(--design-width)));
}

.subway_arw {
	width: calc(100vw * (8 / var(--design-width)));
}

.subway_pop {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.5);
	display: none;
	z-index: 100;
}

.subway_pop_box {
	width: 90%;
	padding: calc(100vw * (40 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background-color: #fff;
	border-radius: var(--common-radius);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-direction: column;
	align-items: center;
}

.subway_naver_logo {
	width: calc(100vw * (54 / var(--design-width)));
}

.subway_pop_box span {
	margin: calc(100vw * (20 / var(--design-width))) 0;
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.5em;
	font-weight: 600;
}

.subway_btn_group {
	display: flex;
	gap: calc(100vw * (6 / var(--design-width)));
	width: 100%;
}

/* subway_btn */
.subway_btn {
	flex: 1;
	background-color: var(--main-color);
	border-radius: var(--common-radius);
	padding: calc(100vw * (14 / var(--design-width)));
	color: #fff;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: calc(100vw * (20 / var(--design-width)));
}

.subway_btn.ok {
	flex: 3;
}

.subway_btn.cancle {
	background-color: transparent;
	color: var(--black-color);
	border: 1px solid var(--border-color);
}

.app_down_wrap {
	position: relative;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	overflow: hidden;
}

.bg-box {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../image/sub/app_down_bg2.png);
	background-size: cover;
	background-position: center;
}

.app_down_box {
	display: flex;
	padding: 0 calc(100vw * (16 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
	justify-content: center;
	flex-direction: column;
	align-items: center;
}

.app_down_logo {
	width: auto;
}

.app_down_title {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4em;
	margin: calc(100vw * (20 / var(--design-width))) calc(100vw * (60 / var(--design-width))) calc(100vw * (42 / var(--design-width)));
	text-align: center;
}

.app_down_tit {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4em;
	color: #fff;
}

.app_down_btn_group {
	display: flex;
	width: 100%;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
}

.app_down_btn {
	display: flex;
	height: calc(100vw * (62 / var(--design-width)));
	align-items: center;
	justify-content: center;
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	gap: calc(100vw * (10 / var(--design-width)));
	border-radius: var(--common-radius);
	background: #FFF;
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.30);
}

.btn--android {
	color: #fff;
	background: #101010;
}

.app_down_btn img {
	height: calc(100vw * (24 / var(--design-width)));
}

.blur-mask {
	position: absolute;
	top: 0;
	width: 100%;
	height: 70%;
	backdrop-filter: blur(6px);
	-webkit-mask-image: linear-gradient(to bottom, transparent 36%, black 70%);
	mask-image: linear-gradient(to bottom, transparent 36%, black 70%);
}

.bg-box::after {
	content: "";
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, transparent 36%, #fff 70%);
}

.card_history_group {
	flex: 1;
	display: flex;
	flex-direction: column;
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.card_history {
	padding: calc(100vw * (26 / var(--design-width))) 0;
	border-bottom: 1px solid var(--border-color);
}

/* card_history_top */
.card_history_top {
	display: flex;
	justify-content: space-between;
}

.card_history_top .history_date {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	line-height: 1.6em;
}

.card_history_top .history_time {
	color: var(--gray-color);
	font-size: calc(100vw * (13 / var(--design-width)));
	line-height: 1.2;
}

.card_history_top .history_detail {
	display: flex;
	font-size: calc(100vw * (12 / var(--design-width)));
	font-weight: 400;
	line-height: 1.6em;
	display: none;
}

.card_history_top .h_detail1 {
	margin-right: calc(100vw * (7 / var(--design-width)));
	padding-right: calc(100vw * (7 / var(--design-width)));
	border-right: 1px solid var(--border-color);
	color: var(--gray-color);
}

.card_history_top .history_num {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	text-align: right;
}

.card_history_top .history_num span {
	font-size: calc(100vw * (21 / var(--design-width)));
	font-weight: 600;
	margin-right: calc(100vw * (4 / var(--design-width)));
}

.card_history_txt {
	margin-top: calc(100vw * (4 / var(--design-width)));
	color: var(--gray-color);
	font-size: calc(100vw * (13 / var(--design-width)));
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
	line-height: 1.4em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* vbank_inner */
.vbank_inner {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	flex: 1;
}

.vbank_inner .vbank_box {
	border: 1.5px solid rgba(0,0,0,0.3);
	border-radius: var(--common-radius);
	margin-top: calc(100vw * (30 / var(--design-width)));
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (12 / var(--design-width)));
	padding: calc(100vw * (20 / var(--design-width)));
}

.vbank_inner .vbank_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.vbank_inner .vbank_title {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
}

.vbank_copy {
	background: var(--main-color);
	color: #fff;
	border-radius: var(--out-radius);
	font-size: calc(100vw * (12 / var(--design-width)));
	padding: calc(100vw * (6 / var(--design-width))) calc(100vw * (12 / var(--design-width)));
}

/* google_top */
.google_top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(100vw * (22 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (12 / var(--design-width)));
	border-bottom: 1px solid #e0e0e6;
}

.google_top .g_gift_title {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
}

.google_top .g_list_filter {
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: calc(100vw * (5 / var(--design-width)));
}

.google_top .g_list_filter img {
	width: calc(100vw * (10 / var(--design-width)));
	height: calc(100vw * (6 / var(--design-width)));
}

.google_top .g_list_filter select {
	background: transparent;
	color: #999;
	font-size: calc(100vw * (14 / var(--design-width)));
	width: fit-content;
	padding: 0;
}

.google_top::after {
	content: "";
	width: 100%;
	height: calc(100vw * (6 / var(--design-width)));
	background-color: #ebebf1;
	position: absolute;
	bottom: calc(100vw * (-6 / var(--design-width)));
	left: 0;
}

/* google_item_group */
.google_item_group {
	display: grid;
	grid-template-columns: repeat(2,1fr);
	margin-top: calc(100vw * (28 / var(--design-width)));
	padding: 0 calc(100vw * (25 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	row-gap: calc(100vw * (40 / var(--design-width)));
	column-gap: calc(100vw * (17 / var(--design-width)));
	justify-items: center;
}

.google_item_group .google_item {
	display: flex;
	flex-direction: column;
}

.google_item_group .google_thumb {
	width: calc(100vw * (155 / var(--design-width)));
	height: calc(100vw * (155 / var(--design-width)));
	overflow: hidden;
	background-color: #ebebf1;
	border-radius: var(--common-radius);
}

.google_item_group .google_thumb .like_btn {
	width: calc(100vw * (28 / var(--design-width)));
	height: calc(100vw * (28 / var(--design-width)));
	position: absolute;
	bottom: calc(100vw * (7 / var(--design-width)));
	right: calc(100vw * (7 / var(--design-width)));
}

.google_item_group .google_item_title {
	font-size: calc(100vw * (15 / var(--design-width)));
	line-height: 1.5em;
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.google_item_group .google_item_subtit {
	font-size: calc(100vw * (11 / var(--design-width)));
	line-height: 1.5em;
	color: var(--main-color);
}

.google_item_group .google_item_discount {
	display: flex;
	align-items: center;
	gap: calc(100vw * (4 / var(--design-width)));
	font-size: calc(100vw * (17 / var(--design-width)));
	color: var(--black-color);
	font-weight: 600;
	line-height: 1.5em;
}

.google_item_group .google_item_discount .percent {
	color: var(--main-color);
}

.google_item_group .google_item_num {
	text-decoration: line-through;
	color: #999;
	line-height: 1.5em;
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 600;
}

/* detail_thumb_area */
.detail_thumb_area {
	background-color: #ebebf1;
	padding: calc(100vw * (60 / var(--design-width))) 0 calc(100vw * (100 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
}

.detail_thumb_area img {
	border-radius: var(--common-radius);
	overflow: hidden;
	width: calc(100vw * (300 / var(--design-width)));
}

/* google_detail_box */
.google_detail_box {
	padding: calc(100vw * (25 / var(--design-width)));
}

.google_detail_box .google_detail_title {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
}

.google_detail_box .google_detail_tit {
	font-size: calc(100vw * (12 / var(--design-width)));
	font-weight: 400;
	line-height: 1.5em;
	margin: calc(100vw * (2 / var(--design-width))) 0 calc(100vw * (14 / var(--design-width)));
}

.google_detail_box .google_detail_discount {
	display: flex;
	align-items: center;
	gap: calc(100vw * (4 / var(--design-width)));
	font-size: calc(100vw * (23 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
}

.google_detail_box .google_detail_discount .percent {
	color: var(--main-color);
}

.google_detail_box .google_detail_num {
	text-decoration: line-through;
	color: #999;
	font-size: calc(100vw * (14 / var(--design-width)));
	margin: calc(100vw * (6 / var(--design-width))) 0;
}

.google_detail_box .google_detail_txt {
	font-size: calc(100vw * (13 / var(--design-width)));
	color: #000;
	font-weight: 400;
	line-height: 1.5em;
}

.google_detail_box .google_detail_txt span {
	font-weight: 600;
	padding-right: calc(100vw * (5 / var(--design-width)));
	margin-right: calc(100vw * (5 / var(--design-width)));
	border-right: 1px solid rgba(119, 119, 119, 0.2);
}

.google_detail_box .google_num_btn {
	display: flex;
	align-items: center;
	font-size: calc(100vw * (14 / var(--design-width)));
	color: #111;
	border: 1px solid rgba(200, 200, 206, 0.5);
	border-radius: var(--common-radius);
	background-color: #f1f1f7;
	width: fit-content;
	margin-top: calc(100vw * (25 / var(--design-width)));
}

.google_detail_box .google_num_btn input {
	width: calc(100vw * (40 / var(--design-width)));
	text-align: center;
	background-color: transparent;
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
}

.google_detail_box .google_num_btn button {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	color: #7e7e84;
	padding: calc(100vw * (4 / var(--design-width))) calc(100vw * (8 / var(--design-width)));
}

/* google_switch_group */
.google_switch_group {
	display: flex;
	align-items: baseline;
	border-bottom: 1px solid #e0e0e6;
}

.google_switch_group .google_switch {
	flex: 1;
	padding: calc(100vw * (15 / var(--design-width)));
	text-align: center;
	border-bottom: 2px solid transparent;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	line-height: 1.75em;
}

.google_switch_group .google_switch.active {
	border-bottom: 2px solid var(--main-color);
}

/* google_detail_textbox */
.google_detail_textbox {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
	display: flex;
	flex-direction: column;
}

.google_detail_textbox .gd_text {
	display: flex;
	flex-direction: column;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.5em;
}

.google_detail_textbox .gd_text span {
	line-height: 1.5em;
	padding-left: calc(100vw * (8 / var(--design-width)));
	text-indent: calc(100vw * (-8 / var(--design-width)));
}

.google_detail_textbox .gd_text a {
	text-decoration: underline;
	color: var(--main-color);
}

.google_detail_textbox .gd_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	margin-top: calc(100vw * (40 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.google_detail_textbox .gd_title:first-child {
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.google_detail_textbox .gray {
	color: #333;
}

.google_detail_textbox .red {
	color: #ff494c;
}

.google_detail_textbox.textbox2 {
	display: none;
}

.google_gift_footer {
	background-color: #ebebf1;
	padding: calc(100vw * (50 / var(--design-width))) 0 calc(100vw * (120 / var(--design-width)));
	text-align: center;
	font-size: calc(100vw * (12 / var(--design-width)));
	font-weight: 400;
	line-height: 1.8em;
	color: #9f9f9f;
}

/* google_fix_btn */
.google_fix_btn {
	display: flex;
	align-items: center;
	gap: calc(100vw * (7 / var(--design-width)));
	padding: calc(100vw * (15 / var(--design-width))) calc(100vw * (25 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #fff;
}

.google_fix_btn .com_btn {
	flex: 1;
	height: calc(100vw * (54 / var(--design-width)));
}

.google_fix_btn .fix_like_btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: calc(100vw * (2 / var(--design-width)));
	width: calc(100vw * (53 / var(--design-width)));
	height: calc(100vw * (54 / var(--design-width)));
	border: 1px solid rgba(126, 126, 132, 0.2);
	border-radius: var(--common-radius);
	color: #7e7e84;
	font-size: calc(100vw * (12 / var(--design-width)));
}

.google_fix_btn .fix_like_btn img {
	width: calc(100vw * (22 / var(--design-width)));
}

#barCode img,
.conv_bar_img img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}

/* sub_wrap */
.sub_wrap {
	background-color: var(--background-color);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	color: var(--black-color);
	gap: calc(100vw * (5 / var(--design-width)));
}

.sub_wrap.guide_bg {
	background-color: #f6f6f6;
}

/* full_modal */
.full_modal .view_detail_btn {
	width: calc(100vw * (68 / var(--design-width)));
	height: calc(100vw * (68 / var(--design-width)));
	position: fixed;
	bottom: calc(100vw * (30 / var(--design-width)));
	right: calc(100vw * (16 / var(--design-width)));
	box-shadow: var(--btn-shadow);
	border-radius: 100%;
	overflow: hidden;
}

.full_modal .view_detail_btn2 {
	width: calc(100vw * (68 / var(--design-width)));
	height: calc(100vw * (68 / var(--design-width)));
	position: fixed;
	bottom: calc(100vw * (30 / var(--design-width)));
	right: calc(100vw * (16 / var(--design-width)));
	box-shadow: var(--btn-shadow);
	border-radius: 100%;
	overflow: hidden;
}

/* withdraw_warp */
.withdraw_warp {
	background-color: var(--background-color);
	margin: 0 calc(100vw * (16 / var(--design-width))) 0;
	min-height: calc(100vh - (100vw * (50 / var(--design-width))));
	padding: calc(100vw * (30 / var(--design-width))) 0;
}

.withdraw_warp .withdraw_title {
	font-size: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4em;
}

.withdraw_warp .withdraw_subtitle {
	margin: calc(100vw * (30 / var(--design-width))) 0 calc(100vw * (10 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
}

.withdraw_warp .withdraw_input_row {
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
}

.withdraw_warp .withdraw_input_row input {
	padding: calc(100vw * (18 / var(--design-width))) calc(100vw * (15 / var(--design-width)));
	border-radius: var(--common-radius);
	border: 1px solid var(--border-color);
	width: calc(100vw * (70 / var(--design-width)));
	text-align: center;
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

.withdraw_warp .withdraw_detail_box {
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	border-radius: var(--common-radius);
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
	background: var(--box-bg-color);
}

.withdraw_warp .withdraw_detail_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
}

.withdraw_warp .withdraw_detail_row .withdraw_detail_idx {
	color: var(--gray-color);
	font-weight: 400;
}

.withdraw_warp .withdraw_detail_cost {
	font-weight: 400;
}

.withdraw_warp .withdraw_detail_cost span {
	color: #000;
	font-weight: 600;
	letter-spacing: calc(100vw * (-0.64 / var(--design-width)));
}

.withdraw_warp .withdraw_cost_input {
	margin-top: calc(100vw * (10 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: calc(100vw * (6 / var(--design-width)));
	font-size: calc(100vw * (22 / var(--design-width)));
	font-weight: 300;
	background: transparent;
	color: var(--black-color);
	font-weight: 600;
	height: calc(100vw * (62 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}


.withdraw_warp .withdraw_cost_input input {
	flex: 1;
	font-size: calc(100vw * (34 / var(--design-width)));
	font-weight: 600;
	text-align: right;
	max-width: unset;
	background-color: transparent;
	width: 100%;
	height: 100%;
}
.withdraw_warp .withdraw_cost_input:has(input:focus) {
	border-bottom: calc(100vw * (2 / var(--design-width))) solid var(--main-color);
}
.withdraw_warp .withdraw_cost_input:has(input:not(:placeholder-shown)) {
	border-bottom: calc(100vw * (2 / var(--design-width))) solid var(--main-color);
}
.withdraw_warp .withdraw_cost_input input::placeholder {
	font-weight: 400;
	color: var(--placeholder);
}

.withdraw_warp .withdraw_cost_input:has(input:not(:placeholder-shown)) span {
	display: block;
}
.withdraw_warp .withdraw_cost_input.on {
	border-bottom: 2px solid var(--main-color);
}

.withdraw_warp .withdraw_cost_input.on input {
	border-bottom: 0;
}

.withdraw_warp .withdraw_cost_input span {
	display: none;
	font-size: calc(100vw * (34 / var(--design-width)));
	font-weight: 400;
}



.withdraw_warp .withdraw_btn_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (8 / var(--design-width)));
	margin: calc(100vw * (10 / var(--design-width))) 0;
}

.withdraw_warp .withdraw_btn_group button {
	flex: 1;
	height: calc(100vw * (46 / var(--design-width)));
	border-radius: var(--common-radius);
	background: var(--box-bg-color);
	border: 0;
	color: var(--black-color);
	font-weight: 600;
}

.withdraw_warp .withdraw_subtext {
	color: var(--gray-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	line-height: 1.6em;
	margin-bottom: calc(100vw * (40 / var(--design-width)));
}

/* withdraw_modal */
.withdraw_modal .com_modal_box {
	background: #fff;
	padding: calc(100vw * (30 / var(--design-width))) 0 0;
}

.withdraw_modal .withdraw_modal_title {
	font-size: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
	line-height: 1.4;
}

.withdraw_modal .withdraw_modal_inner {
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.withdraw_modal .withdraw_modal_info {
	border: 1px solid var(--border-color);
	border-radius: var(--common-radius);
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	margin-bottom: calc(100vw * (30 / var(--design-width)));
	display: flex;
	flex-direction: column;
	row-gap: calc(100vw * (20 / var(--design-width)));
}

.withdraw_modal .withdraw_modal_info .withdraw_modal_row .withdraw_modal_idx {
	color: var(--gray-color);
	max-width: calc(100vw * (110 / var(--design-width)));
}

.withdraw_modal .withdraw_modal_info .withdraw_modal_row .withdraw_modal_text {
	font-size: calc(100vw * (16 / var(--design-width)));
	max-width: calc(100vw * (160 / var(--design-width)));
	text-align: right;
}

.withdraw_modal .withdraw_modal_info .withdraw_modal_row:last-child .withdraw_modal_idx {
	color: var(--black-color);
	font-weight: 600;
}

.withdraw_modal .withdraw_modal_info .withdraw_modal_row:last-child .withdraw_modal_num {
	color: var(--black-color);
	font-weight: 600;
}

.withdraw_modal .withdraw_modal_info .withdraw_modal_row:last-child .withdraw_modal_num .unit {
	font-weight: 400;
}

.withdraw_modal .withdraw_modal_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.withdraw_modal .withdraw_modal_idx {
	font-size: calc(100vw * (16 / var(--design-width)));
}

.withdraw_modal .withdraw_modal_text {
	font-size: calc(100vw * (14 / var(--design-width)));
}

.withdraw_modal .withdraw_modal_num {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: #999;
}

.withdraw_modal .withdraw_modal_num span {
	font-weight: 600;
	color: var(--black-color);
	margin-right: calc(100vw * (3 / var(--design-width)));
}

.withdraw_modal .withdraw_pin_box {
	display: flex;
	align-items: center;
	flex-direction: column;
	gap: calc(100vw * (9 / var(--design-width)));
	padding: calc(100vw * (48 / var(--design-width))) 0;
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	margin: calc(100vw * (10 / var(--design-width))) 0 calc(100vw * (30 / var(--design-width)));
}

.withdraw_modal .withdraw_pin {
	font-size: calc(100vw * (36 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	letter-spacing: 0.08em;
}

.withdraw_modal .withdraw_pin_time {
	display: flex;
	align-items: center;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: var(--main-color);
}

.withdraw_modal .withdraw_pin_time span {
	color: var(--main-color);
	margin-left: calc(100vw * (3 / var(--design-width)));
}

.withdraw_modal .withdraw_pin_time button {
	border-radius: var(--out-radius);
	background: #fff;
	border: 1px solid #808080;
	padding: calc(100vw * (6 / var(--design-width))) calc(100vw * (12 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
	margin-left: calc(100vw * (10 / var(--design-width)));
}



.withdraw_modal .com_btn.unable {
	background: var(--box-bg-color);
	color: var(--gray-color);
}

.withdraw_modal.on {
	transform: translateY(0%);
}

.withdraw_total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #4f5156;
	font-size: calc(100vw * (14 / var(--design-width)));
}

.withdraw_total_num span {
	font-weight: 600;
}

.withdraw_clean {
	display: flex;
	align-items: center;
	gap: calc(100vw * (5 / var(--design-width)));
	font-size: calc(100vw * (13 / var(--design-width)));
}
/* withdraw_item */

.withdraw_item_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (10 / var(--design-width)));
	margin-top: calc(100vw * (12 / var(--design-width)));
	flex: 1;
}

.withdraw_item {
	display: flex;
	flex-direction: column;
	background: var(--box-bg-color);
	border-top: 1px solid var(--border-color);
	border-radius: var(--common-radius);
}

.withdraw_item_cancle {
	padding: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	align-items: center;
	justify-content: center;
	gap: calc(100vw * (8 / var(--design-width)));
	display: none;
}
.withdraw_item_cancle::after {
	content: "";
	display: inline-block;
	width: calc(100vw * (7 / var(--design-width)));
	height: calc(100vw * (14 / var(--design-width)));
	background: var(--black-color);
	mask: url("../image/common/icon_quick.svg") no-repeat center / contain;
	-webkit-mask-: url("../image/common/icon_quick.svg") no-repeat center / contain;
	flex-shrink: 0;
}
.withdraw_item.end .withdraw_item_cancle {
	display: flex;
}
.withdraw_item_top {
	padding: calc(100vw * (24 / var(--design-width)));
	background: #fff;
	border-radius: var(--common-radius);
	box-shadow: 0 0 0 1px var(--border-color);
}

.withdraw_date {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (4 / var(--design-width)));
	max-width: calc(100vw * (180 / var(--design-width)));
}

.withdraw_label {
	width: calc(100vw * (65 / var(--design-width)));
	min-height: calc(100vw * (24 / var(--design-width)));
	border-radius: var(--out-radius);
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: calc(100vw * (4 / var(--design-width))) calc(100vw * (10 / var(--design-width)));
}

.withdraw_item.wait .withdraw_label {
	color: #3b8dae;
	background: #EDFAFF;
}

.withdraw_item.ok .withdraw_label {
	color: #429E59;
	background: #E6FAEB;
}

.withdraw_item.end .withdraw_label {
	color: #4F4F4F;
	background: #F3F3F3;
}

.withdraw_item.cancle .withdraw_label {
	color: #CB341A;
	background: #F8EFEE;
}

.withdraw_item_upper {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	padding-bottom: calc(100vw * (10 / var(--design-width)));
	margin-bottom: calc(100vw * (10 / var(--design-width)));
	border-bottom: 1px solid #eee;
}

/* withdraw_item_under */
.withdraw_item_under {
	display: flex;
	align-items: center;
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 300;
}

.withdraw_item_under span {
	color: var(--black-color);
	font-weight: 600;
}

.withdraw_item_under p {
	color: var(--black-color);
	font-weight: 400;
}




.withdraw_item_btn {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: calc(100vw * (57 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: #59a8c8;
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	border-radius: calc(100vw * (12 / var(--design-width))) calc(100vw * (12 / var(--design-width))) 0 0;
}

.withdraw_item.empty {
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(100vw * (10 / var(--design-width)));
    flex: 1;
    width: 100%;
    color: var(--black-color);
    font-size: calc(100vw * (16 / var(--design-width)));
    font-weight: 600;
	background: var(--white-color);
}

/* finmo_modal */
.finmo_modal {
}

.finmo_modal .com_modal_box {
	padding: calc(100vw * (25 / var(--design-width))) calc(100vw * (20 / var(--design-width))) 0;
}

.finmo_modal .modal_title {
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	flex-shrink: 0;
}

.finmo_modal .finmo_list_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
	max-height: 75vh;
	overflow-y: auto;
}

.finmo_modal .finmo_list {
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	padding: calc(100vw * (24 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	border-radius: var(--common-radius);
	background: var(--box-bg-color);
}

.finmo_modal .finmo_list::after {
	content: "";
	width: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	background-image: url("../image/sub/finmo_list_view.png");
	background-size: 100% 100%;
	position: absolute;
	top: 50%;
	right: calc(100vw * (5 / var(--design-width)));
	transform: translateY(-50%);
}

.finmo_modal .finmo_list:last-child {
	border-bottom: 1px solid var(--border-color);
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.finmo_modal .finmo_img {
	border-radius: var(--out-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.finmo_modal .finmo_img img {
	width: calc(100vw * (30 / var(--design-width)));
}

.finmo_modal .finmo_tit_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (6 / var(--design-width)));
}

.finmo_modal .finmo_title {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: calc(100vw * (8 / var(--design-width)));
}

.finmo_modal .finmo_title span {
	font-weight: 400;
}

.finmo_modal .finmo_title .plus {
	padding: calc(100vw * (3 / var(--design-width))) calc(100vw * (4 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	border-radius: var(--common-radius);
	background: #f6f6f6;
}

.finmo_modal .finmo_title img {
	max-height: calc(100vw * (14 / var(--design-width)));
}

.finmo_modal .finmo_title img[data-src="../image/sub/finmo_img1.png"] {
	max-height: calc(100vw * (17 / var(--design-width)));
}

.finmo_modal .finmo_title img[data-src="../image/sub/finmo_img2.png"] {
	max-height: calc(100vw * (18 / var(--design-width)));
}

.finmo_modal .finmo_title img[data-src="../image/sub/finmo_img4.png"] {
	max-height: calc(100vw * (15 / var(--design-width)));
}

.finmo_modal .finmo_subtitle {
	font-size: calc(100vw * (11 / var(--design-width)));
	color: var(--gray-color);
}

.finmo_modal .finmo_fee {
	text-align: right;
	color: var(--gray-color);
}

.finmo_modal.on {
	transform: translateY(0%);
}

/* point_charge_modal */
.point_charge_modal .finmo_list_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
	margin: calc(100vw * (20 / var(--design-width))) 0;
	max-height: 75vh;
	overflow: scroll;
}

.point_charge_modal .finmo_list {
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	padding: calc(100vw * (12 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	border: 1px solid #efeff2;
	border-radius: var(--common-radius);
}

.point_charge_modal .finmo_img {
	width: calc(100vw * (56 / var(--design-width)));
	height: calc(100vw * (56 / var(--design-width)));
	border-radius: var(--common-radius);
	background-color: #f8f8f8;
	display: flex;
	align-items: center;
	justify-content: center;
}

.point_charge_modal .finmo_img img {
	width: calc(100vw * (30 / var(--design-width)));
}

.point_charge_modal .finmo_tit_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (6 / var(--design-width)));
}

.point_charge_modal .finmo_title {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: calc(100vw * (8 / var(--design-width)));
}

.point_charge_modal .finmo_title span {
	font-weight: 400;
}

.point_charge_modal .finmo_title .plus {
	padding: calc(100vw * (3 / var(--design-width))) calc(100vw * (4 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	border-radius: var(--common-radius);
	background: #f6f6f6;
}

.point_charge_modal .finmo_title img {
	max-height: calc(100vw * (18 / var(--design-width)));
}

.point_charge_modal .finmo_subtitle {
	font-size: calc(100vw * (11 / var(--design-width)));
	color: var(--gray-color);
}

.point_charge_modal .finmo_fee {
	text-align: right;
	color: var(--gray-color);
}

.point_charge_modal.on {
	transform: translateY(0%);
}

/* bank_transfer_modal */
.bank_transfer_modal.on {
	transform: translateY(0);
}

.bank_transfer_modal .select_trigger {
	display: flex;
	align-items: center;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
	gap: calc(100vw * (6 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	border-bottom: calc(100vw * (1 / var(--design-width))) solid #DEE6E9;
}

.bank_transfer_modal .select_trigger .select_trigger_icon {
	width: calc(100vw * (28 / var(--design-width)));
	height: calc(100vw * (28 / var(--design-width)));
}

.bank_transfer_modal .select_trigger .arrow {
	width: calc(100vw * (14 / var(--design-width)));
	margin-left: auto;
}

.bank_transfer_modal .input_box {
	display: flex;
	gap: calc(100vw * (10 / var(--design-width)));
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.bank_transfer_modal .input_box .bank_transfer_inp {
	border-bottom: calc(100vw * (2 / var(--design-width))) solid var(--main-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	font-weight: 600;
	flex: 1;
	min-width: 0;
}
.bank_transfer_modal .input_box .bank_transfer_inp::placeholder {
	color: var(--placeholder);
}

.bank_transfer_modal .input_box .bank_transfer_chk {
	border: calc(100vw * (2 / var(--design-width))) solid var(--main-color);
	display: flex;
	height: calc(100vw * (62 / var(--design-width)));
	min-width: calc(100vw * (90 / var(--design-width)));
	padding: 0 calc(100vw * (12 / var(--design-width)));
	justify-content: center;
	align-items: center;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
	border-radius: var(--common-radius);
	background: var(--white-color);
	color: var(--main-color);
}

.bank_transfer_modal .input_box .bank_transfer_chk.unable {
	border-color: var(--main-color);
	background: var(--white-color);
	color: var(--main-color);
}

.bank_transfer_modal .bank_transfer_point {
	display: flex;
	flex-direction: column;
	margin: calc(100vw * (40 / var(--design-width))) 0;
	gap: calc(100vw * (6 / var(--design-width)));
	opacity: 0;
	transition: 0.3s;
}

.bank_transfer_modal .bank_transfer_point .bank_transfer_tit {
	color: var(--main-color);
	text-align: center;
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

.bank_transfer_modal .bank_transfer_point .bank_transfer_tit.fail {
	color: var(--caution-color);
}

.bank_transfer_modal .bank_transfer_point .bank_transfer_sub {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
	line-height: 140%;
	text-align: center;
}

.bank_transfer_modal .bank_transfer_point .bank_transfer_sub span {
	font-weight: 600;
}

.bank_transfer_modal .bank_transfer_point .bank_transfer_sub span.fail_point {
	color: var(--black-color);
	font-weight: 600;
}

.bank_transfer_modal .com_btn {
	margin-bottom: 0;
}

/* now_php_wrap */
.now_php_wrap {
	background: var(--background-color);
}

.now_php_wrap .php_top {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (22 / var(--design-width)));
	display: flex;
	align-items: center;
	gap: calc(100vw * (12 / var(--design-width)));
}

.now_php_wrap .php_flag {
	width: calc(100vw * (36 / var(--design-width)));
	border-radius: var(--common-radius);
	overflow: hidden;
}

.now_php_wrap .php_flag img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.now_php_wrap .php_text {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (6 / var(--design-width)));
}

.now_php_wrap .php_nation {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.now_php_wrap .php_txt {
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
}

.now_php_wrap .php_bottom {
	flex: 1;
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	border-top: calc(100vw * (8 / var(--design-width))) solid var(--divide-color);
}

.now_php_wrap .php_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
}

.now_php_wrap .php_box {
	background: transparent;
	width: 100%;
	border-radius: 0;
	display: flex;
	align-items: center;
	height: calc(100vw * (64 / var(--design-width)));
	padding: 0 calc(100vw * (20 / var(--design-width)));
	text-align: right;
	font-size: calc(100vw * (16 / var(--design-width)));
	margin: 0 0 calc(100vw * (12 / var(--design-width)));
	box-shadow: unset;
	justify-content: flex-end;
	gap: calc(100vw * (5 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

.now_php_wrap .php_input {
	text-align: right;
	font-size: calc(100vw * (34 / var(--design-width)));
	font-weight: 600;
	color: var(--main-color);
	flex: 1;
	display: flex;
	align-items: center;
	line-height: calc(100vw * (34 / var(--design-width)));
	max-width: calc(100vw * (260 / var(--design-width)));
	z-index: 2;
	background: transparent;
}

.now_php_wrap .php_box.input_box::after {
	content: "Enter the amount";
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 400;
	color: var(--placeholder);
	position: absolute;
	top: 50%;
	right: calc(100vw * (20 / var(--design-width)));
	transform: translateY(-50%);
}

.now_php_wrap .php_box.input_box.on::after {
	display: none;
}

.now_php_wrap .php_box.input_box.on::before {
	content: "";
	width: 100%;
	height: calc(100vw * (2 / var(--design-width)));
	background: var(--main-color);
	position: absolute;
	bottom: 0;
	left: 0;
}

.now_php_wrap .php_method {
	margin: calc(100vw * (12 / var(--design-width))) 0 calc(100vw * (30 / var(--design-width)));
	justify-content: space-between;
	padding: 0 calc(100vw * (12 / var(--design-width)));
	background: #FFF;
	border-radius: var(--common-radius);
	border: 1px solid var(--border-color);
}

.now_php_wrap .php_subtitle {
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
}

.now_php_wrap .error_text {
	margin-left: auto;
	margin-top: calc(100vw * (12 / var(--design-width)));
	font-size: calc(100vw * (12 / var(--design-width)));
	color: var(--caution-color);
	opacity: 0;
}

.now_php_wrap .php_btn_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (7 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.now_php_wrap .php_btn {
	flex: 1;
	background: var(--box-bg-color);
	color: var(--main-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	height: calc(100vw * (36 / var(--design-width)));
	display: flex;
	font-weight: 600;
	align-items: center;
	justify-content: center;
	border-radius: var(--common-radius);
}

.now_php_wrap .input_box .php_cost {
	display: none;
	font-size: calc(100vw * (12 / var(--design-width)));
	color: var(--gray-color);
	font-weight: 400;
	margin-top: calc(100vw * (15 / var(--design-width)));
}

.now_php_wrap .input_box.on .php_cost {
	display: block;
}

.now_php_wrap .fimmo_logo {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.now_php_wrap .fimmo_logo img {
	width: calc(100vw * (188 / var(--design-width)));
}

/* php_modal */
.php_modal.on {
	transform: translateY(0%);
}

.php_modal .com_modal_box {
	padding: calc(100vw * (25 / var(--design-width))) calc(100vw * (20 / var(--design-width))) 0;
}

.php_modal .php_method_group {
	display: flex;
	flex-direction: column;
	max-height: 55vh;
	overflow: scroll;
	gap: calc(100vw * (8 / var(--design-width)));
}

.php_modal .php_method_list {
	padding: 0 calc(100vw * (16 / var(--design-width)));
	border-radius: var(--common-radius);
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
	justify-content: space-between;
	overflow: hidden;
	gap: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	min-height: calc(100vw * (62 / var(--design-width)));
	background: var(--box-bg-color);
}

.php_modal .php_method_list:last-child {
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.php_modal .php_method_list:before {
	content: "";
	display: block;
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
	background: var(--border-color);
	mask: url("../image/sub/chk_normal.svg") no-repeat center / contain;
	-webkit-mask: url("../image/sub/chk_normal.svg") no-repeat center / contain;
}

.php_modal .php_method_list.on {
	border: 1px solid var(--border-color);
}

.php_modal .php_method_list.on:before {
	background: var(--main-color);
}

.php_modal .php_method_list img {
	width: calc(100vw * (188 / var(--design-width)));
}

.php_modal .php_method_list.unable::after {
	content: "";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.15);
	backdrop-filter: blur(1px);
	-webkit-backdrop-filter: blur(1px);
	color: #fff;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	position: absolute;
	top: 0;
	left: 0;
}

/* com_btn_new */
.com_btn_new {
	width: 100%;
	height: calc(100vw * (62 / var(--design-width)));
	border-radius: var(--common-radius);
	text-align: center;
	vertical-align: middle;
	color: #fff;
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	background: var(--main-color);
	margin-top: auto;
	display: block;
	transition: 0.3s;
}

.com_btn_new.fixed {
	position: fixed;
	bottom: 0;
	left: 0;
	border-radius: 0;
}

.com_btn_new.unable {
	border: none !important;
	background: var(--box-bg-color);
	color: var(--gray-color);
}

.vnd_wrap {
	background-color: #fff;
	flex: 1;
}

.vnd_inner {
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
}

.vnd_title {
	font-size: calc(100vw * (27 / var(--design-width)));
	font-weight: 600;
	line-height: 1.25em;
}

.vnd_top {
	padding: calc(100vw * (20 / var(--design-width)));
	border-radius: var(--common-radius);
	border: 1px solid rgba(180,192,211,0.2);
	background-color: rgba(142,155,176,0.08);
	margin-top: calc(100vw * (10 / var(--design-width)));
}

/* vnd_acc */
.vnd_acc {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: calc(100vw * (8 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
	color: rgba(0,0,0,0.6);
	font-weight: 600;
}

.vnd_acc span {
	line-height: calc(100vw * (27 / var(--design-width)));
	width: 100%;
	display: block;
	text-align: center;
	padding-top: calc(100vw * (8 / var(--design-width)));
	border-top: 1px solid black;
}

.vnd_bank {
	padding: calc(100vw * (8 / var(--design-width))) calc(100vw * (14 / var(--design-width)));
	font-size: calc(100vw * (12 / var(--design-width)));
	color: #fff;
	background-color: #2b65f5;
	border-radius: var(--common-radius);
	min-width: calc(100vw * (70 / var(--design-width)));
	min-height: calc(100vw * (28 / var(--design-width)));
	margin: 0 auto;
	text-align: center;
}

.vnd_top .loading-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.15);
	filter: blur(5px);
	z-index: 2;
}

.vnd_name {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	margin-top: calc(100vw * (4 / var(--design-width)));
	text-transform: uppercase;
	text-align: center;
}

.vnd_wrap .section_line {
	height: calc(100vw * (7 / var(--design-width)));
	width: 100%;
	background: #f6f6f6;
	border-top: 1px solid #e9e9e9;
}

/* vnd_subtitle */
.vnd_subtitle {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: #161616;
	display: flex;
	align-items: center;
}

.vnd_subtitle .subtitle_tag {
	display: none;
}

.vnd_subtitle.tag .subtitle_tag {
	display: block;
	color: #fff;
	font-size: calc(100vw * (10 / var(--design-width)));
	padding: calc(100vw * (5 / var(--design-width))) calc(100vw * (8 / var(--design-width)));
	border-radius: var(--out-radius);
	background-color: #fe5050;
	font-weight: 600;
	margin-left: calc(100vw * (6 / var(--design-width)));
}

.vnd_input_box {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
	border: 1.5px solid #111;
	border-radius: var(--out-radius);
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (7 / var(--design-width)));
	font-size: calc(100vw * (13 / var(--design-width)));
	color: #777;
	line-height: 1.75em;
	margin: calc(100vw * (15 / var(--design-width))) 0 0;
}

.vnd_txt {
	font-size: calc(100vw * (12 / var(--design-width)));
	margin-top: calc(100vw * (4 / var(--design-width)));
	color: #fe5050;
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

.vnd_input_box.fail {
	border-color: #fe5050;
}

.vnd_input {
	font-size: calc(100vw * (25 / var(--design-width)));
	font-weight: 600;
}

.vnd_textarea_group {
	width: 100%;
	min-height: calc(100vw * (80 / var(--design-width)));
	max-height: calc(100vw * (80 / var(--design-width)));
	border: 1px solid #dadeef;
	border-radius: var(--common-radius);
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (25 / var(--design-width)));
	margin: calc(100vw * (15 / var(--design-width))) 0 calc(100vw * (35 / var(--design-width)));
}

.vnd_text {
	width: 100%;
	resize: none;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: #111;
	max-height: calc(100vw * (50 / var(--design-width)));
	min-height: calc(100vw * (50 / var(--design-width)));
}

.text_length {
	display: flex;
	font-size: calc(100vw * (12 / var(--design-width)));
	color: rgba(0,0,0,0.3);
	position: absolute;
	bottom: calc(100vw * (15 / var(--design-width)));
	right: calc(100vw * (20 / var(--design-width)));
}

/* alix_modal */
.alix_modal .com_modal_box {
	background-color: #f6f6f6;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: calc(100vw * (25 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	max-height: 100vh;
}

.alix_modal .vnd_okay {
	width: calc(100vw * (60 / var(--design-width)));
	margin: 0 auto;
}

.alix_subtit {
	margin: calc(100vw * (20 / var(--design-width))) 0 calc(100vw * (15 / var(--design-width)));
	font-size: calc(100vw * (15 / var(--design-width)));
	color: rgba(22,22,22,0.5);
}

/* alix_num */
.alix_num {
	font-size: calc(100vw * (26 / var(--design-width)));
	font-weight: 400;
	display: flex;
	align-itmes: center;
	gap: calc(100vw * (4 / var(--design-width)));
	line-height: calc(100vw * (23 / var(--design-width)));
}

.alix_num span {
	font-size: calc(100vw * (30 / var(--design-width)));
	font-weight: 600;
	line-height: calc(100vw * (23 / var(--design-width)));
}

.alix_box {
	width: 100%;
	min-height: calc(100vw * (437 / var(--design-width)));
	background: url(../image/sub/alix_bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: calc(100vw * (30 / var(--design-width)));
	padding: calc(100vw * (25 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	padding-bottom: calc(100vw * (60 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.alix_subtitle {
	font-size: calc(100vw * (12 / var(--design-width)));
	color: #c5c5c5;
	font-weight: 400;
}

.alix_name {
	text-transform: uppercase;
	margin: calc(100vw * (15 / var(--design-width))) 0 calc(100vw * (10 / var(--design-width)));
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

.alix_bottom {
	margin-top: auto;
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (20 / var(--design-width)));
}

.alix_bottom_row {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
}

/* alix_bottom_val */
.alix_bottom_val {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
}

.alix_bottom_val span {
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
}

#camera_ready {
	display: flex;
	flex-direction: column;
	flex: 1;
}

/* camera_start */
#camera_start video {
	display: block;
	width: 100vw;
	height: 100vh;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
}

#camera_start canvas {
	position: absolute;
	top: 35%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 100;
	pointer-events: none;
}

#camera_start .camera_button {
	position: absolute;
	bottom: 20vh;
	left: 50%;
	transform: translateX(-50%);
	padding: 10px 20px;
	font-size: 16px;
	background-color: rgba(0, 0, 0, 0.7);
	color: white;
	border: none;
	border-radius: var(--common-radius);
	z-index: 101;
}

#camera_start {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100vw;
	height: 100vh;
	z-index: 98;
}

/* com_modal_up */
.com_modal_up.check_modal {
	transform: translateY(0%);
	display: none;
	background-color: var(--background-color);
}

.com_modal_up.check_modal_imgchk {
	transform: translateY(0%);
	display: none;
	background-color: var(--background-color);
}

.com_modal_up.check_modal .modal_xbtn {
	width: calc(100vw * (32 / var(--design-width)));
	height: calc(100vw * (32 / var(--design-width)));
	position: absolute;
	top: calc(100vw * (14 / var(--design-width)));
	right: calc(100vw * (16 / var(--design-width)));
	background: url("../image/sub/up_x_btn_popup.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	margin-top: 0;
}

.com_modal_up.check_modal_imgchk .modal_xbtn {
	width: calc(100vw * (32 / var(--design-width)));
	height: calc(100vw * (32 / var(--design-width)));
	position: absolute;
	top: calc(100vw * (14 / var(--design-width)));
	right: calc(100vw * (16 / var(--design-width)));
	background: url("../image/sub/up_x_btn_popup.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	margin-top: 0;
}

.com_modal_up.check_modal_imgchk .com_modal_box {
	max-height: unset;
	height: 100dvh;
	border-radius: 0;
	padding: calc(100vw * (14 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background-color: var(--background-color);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

.com_modal_up.check_modal_imgchk .com_modal_box .check_modal_img {
	text-align: center;
}

.check_modal_imgchk .check_modal_txt {
	font-size: calc(100vw * (12 / var(--design-width)));
	color: var(--gray-color);
	text-align: center;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: calc(100vw * (-0.24 / var(--design-width)));
	margin-bottom: calc(100vw * (14 / var(--design-width)));
}

/* com_modal_up */
.com_modal_up.check_modal .modal_title {
	line-height: 2;
	color: var(--black-color);
}

.com_modal_up.check_modal_imgchk .modal_title {
	line-height: 2;
	color: var(--black-color);
}

.com_modal_up.check_modal .com_modal_box {
	max-height: unset;
	height: 100dvh;
	border-radius: 0;
	padding: calc(100vw * (14 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background-color: var(--background-color);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

.com_modal_up.check_modal .com_modal_box .check_modal_img {
	text-align: center;
}

/* check_modal */
.check_modal .modal_inner {
	max-height: calc(100% - (100vw * (142 / var(--design-width))));
	overflow-y: auto;
	margin: calc(100vw * (20 / var(--design-width))) 0;
}

.check_modal .modal_inner .info_modal_detail {
	padding: calc(100vw * (20 / var(--design-width))) 0;
}

.check_modal .modal_inner .info_modal_detail .input_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (30 / var(--design-width)));
}

.check_modal .modal_inner .info_modal_detail .input_group .input_items {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (12 / var(--design-width)));
}

.check_modal .modal_inner .info_modal_detail .input_group .input_items > span {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
}

.check_modal .modal_inner .info_modal_detail .input_group .select_box {
	display: flex;
	flex-wrap: wrap;
	gap: calc(100vw * (8 / var(--design-width)));
	border-radius: var(--common-radius);
	font-weight: 400;
}

.check_modal .modal_inner .info_modal_detail .input_group .select_box label {
	width: calc((100% - (100vw * (8 / var(--design-width)))) / 2);
}

.check_modal .modal_inner .info_modal_detail .input_group .select_box label input {
	display: none;
}

.check_modal .modal_inner .info_modal_detail .input_group .select_box label span {
	border: 1px solid #D6D9E0;
	border-radius: var(--common-radius);
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 calc(100vw * (10 / var(--design-width)));
	background-color: var(--background-color);
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	height: calc(100vw * (50 / var(--design-width)));
	box-sizing: border-box;
}

.check_modal .modal_inner .info_modal_detail .input_group .select_box label input:checked + span {
	border: 2px solid var(--main-color);
	color: var(--main-color);
}

.check_modal .modal_inner .info_modal_detail .input_group .input_items input {
	border-radius: 0;
	background: var(--background-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
	font-weight: 600;
	padding: 0;
	height: calc(100vw * (50 / var(--design-width)));
	border-bottom: 1px solid var(--border-color);
}

.check_modal .modal_inner .info_modal_detail .input_group .input_items input:focus {
	border-bottom: 2px solid var(--main-color);
}

.check_modal .com_btn_group .com_btn.unable {
	border: 0;
	background-color: var(--box-bg-color);
}

/* signup_wrap */
.signup_wrap .type_row {
	display: flex;
	margin-top: calc(100vw * (10 / var(--design-width)));
	gap: calc(100vw * (6 / var(--design-width)));
}

.signup_wrap .type_row label {
	flex: 1;
	border-radius: var(--common-radius);
	border: 1px solid var(--border-color);
	min-height: calc(100vw * (62 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	background: #FFF;
}

.signup_wrap .type_row label.on {
	border-color: var(--main-color);
	color: var(--main-color);
}

.signup_wrap .type_row label input {
	display: none;
}

.signup_wrap .recommend.none {
	display: none;
}

.signup_wrap .recommend.on {
	height: auto;
	opacity: 1;
}

.gift-history-wrapper {
	margin-bottom: calc(100vw * (30 / var(--design-width)));
}

.gift-history-list {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
}

.gift-history__item {
	display: flex;
	padding: calc(100vw * (15 / var(--design-width))) calc(100vw * (12 / var(--design-width)));
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
	border-radius: var(--common-radius);
	background: #FFF;
	box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.04);
}

.item-header {
	color: var(--main-color);
	display: flex;
	align-items: center;
	gap: calc(100vw * (4 / var(--design-width)));
	font-weight: 600;
	font-size: calc(100vw * (14 / var(--design-width)));
}

.item-body {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
}

.item-body__row {
	display: flex;
	align-items: flex-start;
	gap: calc(100vw * (8 / var(--design-width)));
	justify-content: space-between;
}

.item-body__id {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.item-body__amount {
	flex-shrink: 0;
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.item-body__sub {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	color: var(--gray-color);
}

.pay_wrap {
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
	display: flex;
	flex-direction: column;
	flex: 1;
}

.pv_title {
	font-size: calc(100vw * (27 / var(--design-width)));
	font-weight: 600;
	line-height: 1.25em;
	margin: calc(100vw * (20 / var(--design-width))) 0;
}

.pv_tit {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
}

.pv_text {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
	margin: calc(100vw * (44 / var(--design-width))) 0 calc(100vw * (14 / var(--design-width)));
}

.pv_login_group {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: calc(100vw * (10 / var(--design-width)));
	background-color: #fff;
	border: 2px solid rgba(157, 157, 157, 0.2);
	border-radius: var(--common-radius);
	padding: calc(100vw * (14 / var(--design-width)));
}

.pv_btn {
	background-color: #3e3f40;
	border-radius: var(--common-radius);
	color: #fff;
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
	padding: calc(100vw * (5 / var(--design-width))) calc(100vw * (18 / var(--design-width)));
}

.pv_txt {
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.4em;
	color: #848484;
	font-weight: 600;
	margin: calc(100vw * (10 / var(--design-width))) 0 calc(100vw * (30 / var(--design-width)));
}

.pv_notice {
	background-color: #e4e4e4;
	border-radius: var(--common-radius);
	padding: calc(100vw * (28 / var(--design-width))) calc(100vw * (22 / var(--design-width)));
}

.pv_notice_title {
	color: #262626;
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 600;
}

/* pv_notice_txt */
.pv_notice_txt {
	color: #999;
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	line-height: 1.6em;
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (4 / var(--design-width)));
	margin-top: calc(100vw * (15 / var(--design-width)));
}

.pv_notice_txt span {
	padding-left: calc(100vw * (8 / var(--design-width)));
	text-indent: calc(100vw * (-8 / var(--design-width)));
}

.pv_button {
	width: 100%;
	padding: calc(100vw * (16 / var(--design-width)));
	border-radius: var(--common-radius);
	font-size: calc(100vw * (16 / var(--design-width)));
	color: #fff;
	font-weight: 600;
	background: linear-gradient(99deg, #2B66F6 0%, #1951D8 100%), #215BE6;
	margin-top: calc(100vw * (40 / var(--design-width)));
}

/* ps_input_group */
.ps_input_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (12 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.ps_input_group.sky_bg .ps_input {
	font-size: calc(100vw * (10 / var(--design-width)));
	background-color: #e6ebf1;
	color: #111;
}

.ps_input_title {
	font-size: calc(100vw * (13 / var(--design-width)));
	font-weight: 400;
	color: #111;
}

.ps_input {
	padding: calc(100vw * (16 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background-color: #fff;
	border-radius: var(--common-radius);
}

.ps_input_txt {
	text-align: center;
	font-size: calc(100vw * (12 / var(--design-width)));
	color: #777;
	line-height: 1.6em;
	margin-top: calc(100vw * (10 / var(--design-width)));
}

/* ps_button_group */
.ps_button_group {
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	margin-top: auto;
}

.ps_button_group .pv_button {
	flex: 5;
}

.ps_button_group .pv_button.unable {
	flex: 2;
	background: #b3b5b8;
}

/* pay_wrap */
.pay_wrap .pay_title {
	font-size: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (24 / var(--design-width)));
}

.pay_wrap .pay_subtitle {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 400;
	margin-bottom: calc(100vw * (24 / var(--design-width)));
}

.lpPopup-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.55);
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 20px;
	z-index: 9999;
	display: none;
}

.lpPopup-wrap {
	width: 100%;
	max-width: 420px;
	background: #fff;
	border-radius: 30px;
	overflow: hidden;
	box-shadow: 0 20px 60px rgba(0,0,0,0.25);
	animation: lpPopup-show .25s ease;
}

.lpPopup-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 18px 20px;
	font-size: 17px;
	font-weight: 600;
	border-bottom: 1px solid #f2f2f2;
}

.lpPopup-close {
	font-size: 22px;
	cursor: pointer;
	color: #888;
}

/* lpPopup-content */
.lpPopup-content {
	padding: 22px 20px;
	text-align: center;
	line-height: 2.5;
	color: #444;
	font-size: 15px;
}

.lpPopup-content img {
	width: 100%;
	border-radius: 12px;
	margin-bottom: 14px;
}

.lpPopup-footer {
	padding: 16px 20px 20px 20px;
}

/* lpPopup-today */
.lpPopup-today {
	display: flex;
	align-items: center;
	font-size: 13px;
	color: #666;
	margin-bottom: 12px;
}

.lpPopup-today input {
	margin-right: 6px;
}

.lpPopup-btn {
	width: 100%;
	height: 48px;
	border: none;
	border-radius: 12px;
	background: #3b82f6;
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
}

@keyframes lpPopup-show {
	from {
		transform: translateY(30px);
		opacity: 0;
	}

	to {
		transform: translateY(0);
		opacity: 1;
	}
}

.my_recommend {
	margin-top: calc(100vw * (20 / var(--design-width)));
}

/* btn_request_recomm */
.btn_request_recomm {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: calc(100vw * (62 / var(--design-width)));
	padding: 0 calc(100vw * (16 / var(--design-width)));
	border-radius: var(--common-radius);
	background: #fff;
	font-size: calc(100vw * (15 / var(--design-width)));
	box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.12);
	font-weight: 600;
}

.btn_request_recomm::after {
	content: "";
	display: block;
	width: calc(100vw * (6 / var(--design-width)));
	height: calc(100vw * (12 / var(--design-width)));
	background-image: url("../image/common/g_link_renew.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.btn_my_recomm {
	border: 1px solid var(--main-color);
	background: var(--box-bg-color);
}

.recomm_body {
	display: flex;
	flex-direction: column;
	padding: 0 calc(100vw * (16 / var(--design-width)));
	min-height: calc(100dvh - (100vw * (80 / var(--design-width))));
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.recomm_title {
	color: var(--black-color);
	font-size: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
}

/* recomm_regist_motive */
.recomm_regist_motive {
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.recomm_regist_motive label {
	display: block;
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	margin-bottom: calc(100vw * (10 / var(--design-width)));
	text-indent: calc(100vw * (4 / var(--design-width)));
}

.recomm_motive {
	width: 100%;
	height: calc(100vw * (130 / var(--design-width)));
	padding: calc(100vw * (12 / var(--design-width)));
	border-radius: var(--common-radius);
	background: #FFF;
	font-size: calc(100vw * (18 / var(--design-width)));
}

.caution_global {
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.caution_title {
	color: var(--black-color);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

/* caution_body */
.caution_body li {
	padding-left: calc(100vw * (16 / var(--design-width)));
	position: relative;
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
	margin-bottom: calc(100vw * (12 / var(--design-width)));
}

.caution_body li::before {
	content: "";
	display: block;
	position: absolute;
	top: calc(100vw * (6 / var(--design-width)));
	left: calc(100vw * (5 / var(--design-width)));
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	border-radius: var(--common-radius);
	background: var(--black-color);
}

#btn_recomm_regist {
	margin-top: auto;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

/* my_code_box */
.my_code_box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: calc(100vw * (8 / var(--design-width)));
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	padding: 0 calc(100vw * (10 / var(--design-width))) 0 calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.my_code_box .btn_copy {
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(100vw * (48 / var(--design-width)));
	height: calc(100vw * (48 / var(--design-width)));
}

.my_code_box .btn_copy img {
	width: calc(100vw * (30 / var(--design-width)));
	height: calc(100vw * (30 / var(--design-width)));
}

/* recomm_link_list */
.recomm_link_list li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	height: calc(100vw * (66 / var(--design-width)));
}

.recomm_link_list li::after {
	content: "";
	display: block;
	width: calc(100vw * (6 / var(--design-width)));
	height: calc(100vw * (12 / var(--design-width)));
	background-image: url("../image/common/g_link_renew.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.recomm_link_list li:active {
	background-color: var(--box-bg-color);
}

/* slide_pop */
.slide_pop {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
	visibility: hidden;
	transition: visibility 0.3s;
}

.slide_pop.active {
	visibility: visible;
}

.sp_modal {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.slide_pop.active .sp_modal {
	opacity: 1;
}

.sp_body {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #fff;
	border-radius: var(--out-radius) var(--out-radius) 0 0;
	padding: calc(100vw * (40 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
	box-sizing: border-box;
	transform: translateY(100%);
	transition: transform 0.3s ease-out;
}

.slide_pop.active .sp_body {
	transform: translateY(0);
}

.sp_title {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	text-align: center;
	margin-bottom: calc(100vw * (12 / var(--design-width)));
	color: var(--main-color);
}

.sp_text {
	font-size: calc(100vw * (16 / var(--design-width)));
	text-align: center;
	line-height: 1.6;
}

.sp_btn_group {
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.btn_sp {
	display: flex;
	width: 100%;
	height: calc(100vw * (58 / var(--design-width)));
	font-size: calc(100vw * (18 / var(--design-width)));
	justify-content: center;
	align-items: center;
	border-radius: var(--common-radius);
	background: var(--main-color);
	color: #fff;
}

/* sp_modal_up */
.sp_modal_up {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	visibility: hidden;
	transition: visibility 0.5s;
	z-index: 999;
}

.sp_modal_up.on {
	visibility: visible;
}

.sp_modal_up .bg {
	display: block !important;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000000;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease;
	z-index: 1;
}

.sp_modal_up.on .bg {
	display: block !important;
	visibility: visible;
	opacity: 0.5;
}

.sp_modal_box {
	position: absolute;
	bottom: calc(100vw * (12 / var(--design-width)));
	left: calc(100vw * (12 / var(--design-width)));
	width: calc(100vw - (100vw * (24 / var(--design-width))));
	background: #FFFFFF;
	border-radius: var(--out-radius);
	padding: calc(100vw * (35 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (30 / var(--design-width)));
	transform: translateY(100%);
	transition: transform 0.3s ease-out;
	z-index: 2;
	max-height: 85vh;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
}

/* sp_modal_up */
.sp_modal_up.on .sp_modal_box {
	transform: translateY(0);
}

.sp_modal_up .modal_xbtn {
	position: sticky;
	top: calc(100vw * (-35 / var(--design-width)));
	z-index: 10;
	background-color: #ffffff;
	flex-shrink: 0;
	width: 100%;
	height: calc(100vw * (36 / var(--design-width)));
	background-image: url("../image/sub/up_x_btn_renew.png");
	background-size: calc(100vw * (40 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
	margin-top: calc(100vw * (-35 / var(--design-width)));
	cursor: pointer;
}

.sp_modal_box .sp_modal_title {
	position: sticky;
	top: calc(100vw * (1 / var(--design-width)));
	z-index: 10;
	background-color: #ffffff;
	padding-bottom: calc(100vw * (10 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

/* reward_wrap */
.reward_wrap {
}

.reward_wrap .point_switch .switch.active {
	color: var(--reward-color);
}

.reward_wrap .plus_have {
	background-color: var(--reward-color);
}

.btn_view_history {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: var(--black-color);
	font-weight: 600;
	font-size: calc(100vw * (16 / var(--design-width)));
	border-radius: var(--out-radius);
	border: 1px solid var(--border-color);
	background: var(--box-bg-color);
	padding: 0 calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	width: 100%;
}

.history_wrapper {
	position: relative;
	min-height: calc(100vh - (100vw * (60 / var(--design-width))));
	display: flex;
	flex-direction: column;
}

.history_wallet {
	position: relative;
	width: calc(100vw * (343 / var(--design-width)));
	margin: 0 auto;
	background: #FFFFFF;
	border-radius: var(--common-radius);
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
	box-shadow: 0 0 calc(100vw * (26 / var(--design-width))) 0 rgba(85, 108, 116, 0.12);
}

.hs-wallet_label {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	font-size: calc(100vw * (13 / var(--design-width)));
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

/* hs-wallet_amount */
.hs-wallet_amount {
	display: flex;
	align-items: baseline;
	gap: calc(100vw * (4 / var(--design-width)));
	color: var(--black-color);
	font-weight: 600;
}

.hs-wallet_amount .unit {
	font-size: calc(100vw * (32 / var(--design-width)));
}

.hs-wallet_amount .number {
	font-size: calc(100vw * (32 / var(--design-width)));
	letter-spacing: -0.5px;
}

.hs-filter_wrapper {
	width: 100%;
	padding: 0 calc(100vw * (16 / var(--design-width)));
	margin: calc(100vw * (26 / var(--design-width))) 0 calc(100vw * (16 / var(--design-width)));
	box-sizing: border-box;
	flex-shrink: 0;
}

/* hs-info_bar */
.hs-info_bar {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-bottom: calc(100vw * (12 / var(--design-width)));
	gap: calc(100vw * (6 / var(--design-width)));
}

.hs-info_bar .count {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: #8E949E;
}

.hs-filter_select_btn {
	display: flex;
	align-items: center;
	gap: calc(100vw * (10 / var(--design-width)));
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	height: calc(100vw * (24 / var(--design-width)));
}

.hs-btn_clear {
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(100vw * (24 / var(--design-width)));
	height: calc(100vw * (24 / var(--design-width)));
}

.hs-divider {
	width: 1px;
	height: calc(100vw * (10 / var(--design-width)));
	background: var(--border-color);
}

.hs-icon_filter {
	display: inline-block;
	width: calc(100vw * (18 / var(--design-width)));
	height: calc(100vw * (18 / var(--design-width)));
}

.hs-search_box {
	position: relative;
	width: 100%;
	height: calc(100vw * (62 / var(--design-width)));
}

.hs-search_input {
	width: 100%;
	height: 100%;
	background: #FFFFFF;
	border-radius: var(--common-radius);
	padding: 0 calc(100vw * (50 / var(--design-width))) 0 calc(100vw * (20 / var(--design-width)));
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
}

.hs-search-input::placeholder {
	color: var(--placeholder);
}

.hs-btn_search {
	position: absolute;
	right: calc(100vw * (0 / var(--design-width)));
	top: 50%;
	transform: translateY(-50%);
	width: calc(100vw * (52 / var(--design-width)));
	height: calc(100vw * (52 / var(--design-width)));
	background: url("../image/icon_search.png") no-repeat center / contain;
	border: none;
	cursor: pointer;
}

/* hs-summary_wrapper */
.hs-summary_wrapper {
	padding: 0 calc(100vw * (16 / var(--design-width)));
	flex-shrink: 0;
}

.hs-summary_wrapper.hs-row1 .hs-summary_item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
}

.hs-summary_box {
	display: flex;
	align-items: center;
	background: var(--box-bg-color);
	border-radius: var(--common-radius);
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (14 / var(--design-width)));
	gap: calc(100vw * (13 / var(--design-width)));
}

.hs-summary_item {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.hs-amount-group {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.hs-income {
	align-items: flex-end;
	text-align: right;
}

.hs-expense {
	align-items: flex-end;
	text-align: right;
}

.hs-label {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	margin-bottom: calc(100vw * (4 / var(--design-width)));
}

.hs-amount {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	letter-spacing: -0.5px;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.hs-income .hs-amount {
	color: var(--main-color);
}

.hs-expense .hs-amount {
	color: var(--black-color);
}

.hs-count {
	font-size: calc(100vw * (13 / var(--design-width)));
	color: var(--gray-color);
}

.hs-summary_divider {
	width: 1px;
	height: calc(100vw * (60 / var(--design-width)));
	background: var(--border-color);
}

.hs-list-group {
	padding: 0 calc(100vw * (16 / var(--design-width)));
	margin-top: calc(100vw * (30 / var(--design-width)));
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: calc(100vw * (20 / var(--design-width)));
	overflow-y: auto;
}

.hs-history_empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex: 1;
	max-height: 60vh;
	padding: 0 calc(100vw * (20 / var(--design-width)));
}

.hs-empty_title {
	font-size: calc(100vw * (20 / var(--design-width)));
	color: var(--black-color);
	font-weight: 600;
	margin-top: calc(100vw * (20 / var(--design-width)));
}

.hs-empty_desc {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.hs-history_item {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	border-bottom: 1px solid var(--border-color);
	padding-bottom: calc(100vw * (12 / var(--design-width)));
	gap: calc(100vw * (6 / var(--design-width)));
}

.hs-history_left {
	display: flex;
	gap: calc(100vw * (12 / var(--design-width)));
}

/* hs-history_icon */
.hs-history_icon {
	width: calc(100vw * (32 / var(--design-width)));
	height: calc(100vw * (32 / var(--design-width)));
	background: #D6D9E0;
	border-radius: var(--common-radius);
	display: none;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.hs-history_icon img {
	width: calc(100vw * (14 / var(--design-width)));
	aspect-ratio: 30/51;
}

.hs-history_info p:last-child {
	margin-bottom: 0;
}

.hs-history_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	margin-bottom: calc(100vw * (8 / var(--design-width)));
}

.hs-history_date,
.hs-history_type,
.hs-history_name,
.hs-history_email {
	font-size: calc(100vw * (13 / var(--design-width)));
	color: var(--gray-color);
	margin-bottom: calc(100vw * (6 / var(--design-width)));
}

/* hs-history_email */
.hs-history_email {
	color: var(--black-color);
	display: block;
	width: 100%;
	white-space: normal;
	word-break: break-all;
	word-wrap: break-word;
	overflow: visible;
}

.hs-history_email .btn-copy {
	display: inline-block;
	vertical-align: middle;
}

.hs-history_status {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--black-color);
}

.hs-history_right {
	text-align: right;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: space-between;
	flex-shrink: 0;
}

/* hs-history_amount */
.hs-history_amount {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	letter-spacing: -0.5px;
	margin-bottom: calc(100vw * (8 / var(--design-width)));
}

.hs-history_amount.hs-plus {
	color: var(--main-color);
}

.hs-history_amount.hs-minus {
	color: var(--black-color);
}

.filter_group {
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.filter_label {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--gray-color);
	margin-bottom: calc(100vw * (12 / var(--design-width)));
}

/* filter_grid */
.filter_grid {
	display: grid;
	gap: calc(100vw * (6 / var(--design-width)));
}

.filter_grid.col_3 {
	grid-template-columns: repeat(3, 1fr);
}

.filter_grid.col_2 {
	grid-template-columns: repeat(2, 1fr);
}

.filter_grid label {
	display: flex;
	align-items: center;
	justify-content: center;
	height: calc(100vw * (48 / var(--design-width)));
	border: 1px solid var(--border-color);
	border-radius: var(--common-radius);
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--black-color);
	background: #fff;
	cursor: pointer;
	transition: all 0.2s;
}

.filter_grid input:checked + label {
	background: var(--box-bg-color);
	color: var(--black-color);
	font-weight: 600;
}

.filter_footer {
	display: flex;
	gap: calc(100vw * (10 / var(--design-width)));
	margin-top: calc(100vw * (20 / var(--design-width)));
}

/* btn-popup-inner */
.btn-popup-inner {
	height: calc(100vw * (58 / var(--design-width)));
	border: 1px solid var(--border-color);
	border-radius: var(--common-radius);
	background: #fff;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	padding: 0 calc(100vw * (10 / var(--design-width)));
}

.btn-popup-inner.is-active {
	background: var(--main-color);
	color: #fff;
	border: none;
}

.btn-popup-inner:disabled {
	background: var(--box-bg-color);
	color: var(--gray-color);
	border: none;
}

.btn_reset {
	flex: 1;
}

.btn_apply {
	flex: 2;
}

.filter_period_setting {
	display: none;
	grid-column: span 3;
	align-items: center;
	justify-content: space-between;
	padding: 0 calc(100vw * (12 / var(--design-width)));
	height: calc(100vw * (44 / var(--design-width)));
	background-color: #F3FCFF;
	border: 1px solid #B0E8FF;
	border-radius: var(--common-radius);
	margin-top: calc(100vw * (10 / var(--design-width)));
}

#manual:checked ~ .filter_period_setting {
	display: flex;
}

.date_input_box {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex: 1;
}

/* hidden_date_input */
.hidden_date_input {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	z-index: 10;
	cursor: pointer;
	-webkit-appearance: none;
}

.hidden_date_input::-webkit-calendar-picker-indicator {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	cursor: pointer;
	opacity: 0;
}

.date_input_box input[type="date"] {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	z-index: 2;
	cursor: pointer;
}

.date_text {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--black-color);
	font-weight: 600;
}

.icon_cal {
	display: inline-block;
	width: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	background: url("/image/sub/icon_calendar.svg") no-repeat center / contain;
}

.swung_dash {
	font-size: calc(100vw * (16 / var(--design-width)));
	color: var(--black-color);
	margin: 0 calc(100vw * (10 / var(--design-width)));
}

.history_tab_wrap {
	display: flex;
	align-items: center;
	padding: 0 calc(100vw * (16 / var(--design-width)));
	width: 100%;
	height: calc(100vw * (52 / var(--design-width)));
	top: calc(100vw * (60 / var(--design-width)));
	z-index: 2;
	background: var(--background-color);
	position: fixed;
}

/* hs-tab_item */
.hs-tab_item {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	border-bottom: calc(100vw * (1 / var(--design-width))) solid var(--border-color);
	font-size: calc(100vw * (17 / var(--design-width)));
	font-weight: 600;
	color: var(--gray-color);
	padding: calc(100vw * (10 / var(--design-width)));
}

.hs-tab_item.is-active {
	color: var(--black-color);
	border-bottom: calc(100vw * (2 / var(--design-width))) solid var(--black-color);
}

.history_tab_wrap + * {
	margin-top: calc(100vw * (80 / var(--design-width))) !important;
}

.res-modal_container {
	background: #fff;
	width: 100%;
}

.res-plus_text {
	color: #007BFF !important;
}

.res-minus_text {
	color: #333 !important;
}

.res-history_header {
	text-align: center;
	padding: calc(100vw * (10 / var(--design-width))) 0;
	border-bottom: 1px solid var(--black-color);
	margin: 0 calc(100vw * (16 / var(--design-width)));
}

.res-user_name {
	font-size: calc(100vw * (22 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	margin-bottom: calc(100vw * (8 / var(--design-width)));
}

.res-user_email {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--gray-color);
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

/* res-summary_item */
.res-summary_item {
	font-size: calc(100vw * (14 / var(--design-width)));
	margin-bottom: calc(100vw * (8 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.res-summary_item .label {
	color: var(--gray-color);
	margin-right: 4px;
}

.res-summary_item .value {
	margin-left: auto;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.history_wrapper i {
	font-style: normal;
}

.res-summary_item .count {
	color: var(--gray-color);
	margin-left: 4px;
}

/* res-history_list */
.res-history_list {
	padding: 0 calc(100vw * (16 / var(--design-width)));
}

.res-history_list .res-user_email {
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

/* res-history_item */
.res-history_item {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding: calc(100vw * (20 / var(--design-width))) 0;
	border-bottom: 1px solid var(--border-color);
}

.res-history_item .item_name {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	margin-bottom: calc(100vw * (4 / var(--design-width)));
}

.res-history_item .item_date {
	font-size: calc(100vw * (13 / var(--design-width)));
	color: var(--gray-color);
}

.res-history_item .item_amount {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	letter-spacing: -0.5px;
}

body.is-popup-open {
	overflow: hidden !important;
	touch-action: none;
	-webkit-overflow-scrolling: none;
}

/* sp-modal_up */
.sp-modal_up {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	visibility: hidden;
	transition: visibility 0.5s;
	z-index: 999;
}

.sp-modal_up.on {
	visibility: visible;
}

.sp-modal_up .bg-dim {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000000;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease;
	z-index: 1;
}

.sp-modal_up.on .bg-dim {
	visibility: visible;
	opacity: 0.5;
}

.sp-modal_box {
	position: absolute;
	bottom: 0;
	left: 0;
	width: calc(100vw - (100vw * (24 / var(--design-width))));
	background: #FFFFFF;
	border-radius: var(--out-radius);
	padding: calc(100vw * (35 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	box-sizing: border-box;
	transform: translateY(100%);
	transition: transform 0.3s ease-out;
	z-index: 2;
	max-height: 85vh;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	margin: 0 calc(100vw * (12 / var(--design-width))) calc(100vw * (12 / var(--design-width)));
}

/* sp-modal_up */
.sp-modal_up.on .sp-modal_box {
	transform: translateY(0);
}

.sp-modal_up .modal_xbtn {
	position: sticky;
	top: calc(100vw * (-35 / var(--design-width)));
	z-index: 10;
	background-color: #ffffff;
	flex-shrink: 0;
	width: 100%;
	height: calc(100vw * (36 / var(--design-width)));
	background-image: url("../image/sub/up_x_btn_renew.png");
	background-size: calc(100vw * (40 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
	margin-top: calc(100vw * (-35 / var(--design-width)));
	cursor: pointer;
}

.sp-modal_box .sp-modal_title {
	position: sticky;
	top: calc(100vw * (1 / var(--design-width)));
	z-index: 10;
	background-color: #ffffff;
	padding-bottom: calc(100vw * (10 / var(--design-width)));
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 600;
	font-size: calc(100vw * (18 / var(--design-width)));
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.icon-shortcut-w {
	width: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	aspect-ratio: 1/1;
}

.push_wrapper {
	margin-top: calc(100vw * (21 / var(--design-width)));
}

/* push_item */
.push_item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: calc(100vw * (30 / var(--design-width)));
	padding-left: calc(100vw * (10 / var(--design-width)));
}

.push_item.push_all {
	margin-bottom: calc(100vw * (36 / var(--design-width)));
	padding-left: 0;
}

.push_wrapper .push_item .left {
	font-size: calc(100vw * (17 / var(--design-width)));
}

.push_item.push_all .left {
	font-size: calc(100vw * (18 / var(--design-width)));
}

/* com_modal_up */
.com_modal_up .bg {
	width: 100vw;
	height: 200vh;
	background-color: rgba(0, 0, 0, 0.5);
	position: fixed;
	bottom: 0;
	left: 0;
	display: none;
}

.com_modal_up {
	transform: translateY(100%);
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 999;
	transition: 0.2s ease-in-out;
	display: flex;
	flex-direction: column;
}

.com_modal_up .modal_xbtn {
	width: 100%;
	height: calc(100vw * (36 / var(--design-width)));
	position: relative;
	top: auto;
	left: auto;
	flex-shrink: 0;
	z-index: 3;
	background-image: url("../image/sub/up_x_btn_renew.png");
	background-size: calc(100vw * (40 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
	margin-bottom: calc(100vw * (10 / var(--design-width)));
}

.com_modal_up .modal_xbtn img {
	display: none;
}

.com_modal_up .modal_title {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
	flex-shrink: 0;
}

.com_modal_up .modal_desc {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.com_modal_up .com_modal_box {
	margin: auto 0 0;
	padding: 0 calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	background-color: #fff;
	border-radius: var(--out-radius) var(--out-radius) 0 0;
	position: relative;
	display: flex;
	flex-direction: column;
	max-height: 80vh;
	overflow: hidden;
}

.com_modal_box .scroll_inner {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	flex: 1;
}

.mycard_wrap {
	display: flex;
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	align-items: center;
	justify-content: space-between;
	gap: calc(100vw * (10 / var(--design-width)));
	border-radius: var(--common-radius);
	background: #FFF;
	box-shadow: var(--box-shadow);
	min-height: calc(100vw * (112 / var(--design-width)));
	margin: calc(100vw * (20 / var(--design-width))) calc(100vw * (16 / var(--design-width))) 0;
}

/* card_balance_box */
.card_balance_box .title {
	font-size: calc(100vw * (14 / var(--design-width)));
	color: var(--black-color);
	margin-bottom: calc(100vw * (8 / var(--design-width)));
}

.card_balance_box .balance {
	font-size: calc(100vw * (28 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	margin-bottom: calc(100vw * (4 / var(--design-width)));
}

/* mycard_wrap */
.mycard_wrap .msg {
	font-size: calc(100vw * (20 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
}

.mycard_wrap .d-card {
	flex-shrink: 0;
}

.mycard_wrap .d-card img {
	width: calc(100vw * (45 / var(--design-width)));
	transform: rotate(90deg);
}

.btn_charging {
	margin: 0 calc(100vw * (16 / var(--design-width)));
}

.card_wrap .mc_pause {
	color: var(--caution-color);
}

.card_reissue_btn {
	margin: 0 calc(100vw * (16 / var(--design-width)));
}

/* diagram_wrap */
.diagram_wrap {
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.diagram_wrap .title {
	font-size: calc(100vw * (14 / var(--design-width)));
	text-align: center;
	font-weight: 600;
	color: var(--gray-color);
}

.card_now_icon {
	margin: calc(100vw * (10 / var(--design-width))) auto;
	width: 100%;
	margin-top: calc(100vw * (10 / var(--design-width)));
	aspect-ratio: 622/188;
}

.up_box .com_btn {
	margin-bottom: 0;
	width: calc((100% - (100vw * (6 / var(--design-width)))) / 2);
	height: calc(100vw * (58 / var(--design-width)));
}

/* card_wrap */
.card_wrap .lost_img {
	position: relative;
	background: var(--box-bg-color);
	padding: calc(100vw * (52 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
	display: flex;
	flex-direction: column;
	align-items: center;
}

.card_wrap .lost_img .card_title {
	font-size: calc(100vw * (20 / var(--design-width)));
}

.card_wrap .lost_img .d-card {
	width: calc(100vw * (190 / var(--design-width)));
	margin: calc(100vw * (30 / var(--design-width))) auto 0;
}

/* select-box_global */
.select-box_global {
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.select-box_global .title {
	margin-bottom: calc(100vw * (8 / var(--design-width)));
	color: var(--gray-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 400;
}

.card_exit_reason {
	padding: calc(100vw * (19 / var(--design-width))) calc(100vw * (21 / var(--design-width)));
	border-radius: var(--common-radius);
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--black-color);
	border: 1px solid var(--border-color);
	font-weight: 600;
}

.cd-hero-section {
	width: 100vw;
	height: calc(100vw * (445 / var(--design-width)));
	position: relative;
	background: url("/image/sub/bg_card_guide.png") top center no-repeat;
	background-size: calc(100vw * (375 / var(--design-width))) calc(100vw * (445 / var(--design-width)));
	padding: calc(100vw * (70 / var(--design-width))) calc(100vw * (40 / var(--design-width))) 0;
	overflow: hidden;
}

/* title_wrap */
.title_wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.title_wrap img {
	width: calc(100vw * (146 / var(--design-width)));
}

.title_wrap .title {
	font-size: calc(100vw * (24 / var(--design-width)));
	font-weight: 600;
	margin-top: calc(100vw * (20 / var(--design-width)));
	text-align: center;
	line-height: 1.2;
}

/* cd-hero-section */
.cd-hero-section .d-card {
	margin-top: calc(100vw * (126 / var(--design-width)));
}

.cd-hero-section .d-card img {
	width: calc(100vw * (254 / var(--design-width)));
	transform: rotate(90deg);
}

.accordion_global {
	margin: calc(100vw * (48 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (80 / var(--design-width)));
}

.acc_item {
	background: #fff;
	border-radius: var(--common-radius);
	margin-bottom: calc(100vw * (10 / var(--design-width)));
	overflow: hidden;
	box-shadow: 0 6px 12px 0 rgba(129, 138, 142, 0.12);
}

.acc_header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width)));
}

.acc_title {
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
}

.acc_icon {
	width: calc(100vw * (21 / var(--design-width)));
	height: calc(100vw * (21 / var(--design-width)));
	background-image: url("/image/sub/icon_arrow_down.svg");
	background-size: contain;
	background-repeat: no-repeat;
	transition: transform 0.25s;
}

.acc_item.open .acc_icon {
	transform: rotate(180deg);
}

.acc_body {
	max-height: 0;
	overflow-y: auto;
	transition: max-height 0.3s ease;
}

.acc_item.open .acc_body {
	max-height: 600px;
}

.acc_body_inner {
	padding: 0 calc(100vw * (16 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
}

.cg_step {
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.cg_step_title {
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (8 / var(--design-width)));
	position: relative;
}

.cg_step_desc {
	font-size: calc(100vw * (16 / var(--design-width)));
	line-height: 1.6;
	padding-left: calc(100vw * (16 / var(--design-width)));
	position: relative;
}

/* unordered */
.unordered {
	padding-left: calc(100vw * (16 / var(--design-width)));
}

.unordered::before {
	content: "";
	display: block;
	width: calc(100vw * (3 / var(--design-width)));
	height: calc(100vw * (3 / var(--design-width)));
	background-color: var(--black-color);
	border-radius: 100%;
	position: absolute;
	left: calc(100vw * (4 / var(--design-width)));
	top: calc(100vw * (6 / var(--design-width)));
}

.cg_step_desc.unordered::before {
	top: calc(100vw * (11 / var(--design-width)));
}

.google_login {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: calc(100vw * (10 / var(--design-width)));
	height: calc(100vw * (62 / var(--design-width)));
	border-radius: var(--common-radius);
	background: #FFF;
	box-shadow: var(--btn-shadow);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
}

.reviewer {
	border-radius: var(--common-radius);
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	color: var(--black-color);
	background: #FFF;
	box-shadow: var(--btn-shadow);
}

.bottom_wrap {
	margin: auto 0 0;
}

/* remit_inner */
.remit_inner .input_row.remittance_balance_wrap {
	padding: 0;
	display: flex;
	background: unset;
	margin-top: calc(100vw * (20 / var(--design-width)));
	max-width: 100%;
	height: auto;
	align-items: center;
	border-radius: 0;
	font-weight: 600;
	justify-content: flex-start;
	border: unset;
	gap: calc(100vw * (8 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
}

.remit_inner .input_row.remittance_balance_wrap .label {
	color: var(--gray-color);
}


.remittance_total_wrap {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (8 / var(--design-width)));
}

/* remittance_total_top */
.remittance_total_top {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.remittance_total_top .label {
	font-size: calc(100vw * (15 / var(--design-width)));
	color: var(--black-color);
}

.remittance_total_top #btn_amount_reset {
	display: flex;
	align-items: center;
	gap: calc(100vw * (3 / var(--design-width)));
	color: var(--black-color);
	font-size: calc(100vw * (15 / var(--design-width)));
}

.bank_up .com_btn_group .com_btn#btn_remittance_amount {
	width: 100%;
}

#remittance_point_str_pop {
	display: flex;
	padding: calc(100vw * (20 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	align-items: center;
	justify-content: flex-end;
	border-bottom: 1px solid var(--black-color);
	font-size: calc(100vw * (30 / var(--design-width)));
	color: var(--blaco-color);
	font-weight: 600;
}

/* c_charge_header */
.c_charge_header {
	width: 100vw;
	height: calc(100vw * (292 / var(--design-width)));
	position: relative;
	background: url("/image/sub/bg_charge.png") top center no-repeat;
	background-size: calc(100vw * (375 / var(--design-width))) calc(100vw * (292 / var(--design-width)));
	padding: calc(100vw * (48 / var(--design-width))) calc(100vw * (40 / var(--design-width)));
}

.c_charge_header .page-big-title {
	width: calc(100vw * (200 / var(--design-width)));
}

.common_wrap.c_charge_wrapper {
	overflow: visible;
}

.charge_notice.charge_notice--modify {
	margin: calc(100vw * (30 / var(--design-width))) calc(100vw * (16 / var(--design-width))) calc(100vw * (60 / var(--design-width)));
}

.charge_notice--modify .row2 {
	margin-top: calc(100vw * (10 / var(--design-width)));
}

.com_modal_up .com_btn {
	height: calc(100vw * (52 / var(--design-width)));
}

/* up_box */
.up_box.amount_box {
	padding: 0 0 calc(100vw * (20 / var(--design-width)));
}

.up_box.amount_box .u_title {
	padding: 0 calc(100vw * (20 / var(--design-width))) 0;
}

.up_box.amount_box .scroll_inner {
	padding: 0 calc(100vw * (20 / var(--design-width))) 0;
}

.up_box.amount_box .point_grid {
}

/* contact_wrap--etc */
.contact_wrap--etc {
	background: var(--background-color);
	min-height: 100vh;
}

.contact_wrap--etc .contact_switch {
	flex-shrink: 0;
	position: unset;
}

.contact_wrap--etc .etc_content_box {
	padding-top: calc(100vw * (40 / var(--design-width)));
	padding-bottom: calc(100vw * (80 / var(--design-width)));
	flex-glow: 1;
	overflow-y: auto;
}

.contact_wrap--etc .etc_content_box p {
	line-height: 1.6;
}

.visible_wrap {
	overflow: visible;
}

.guide_wrapper {
	padding-bottom: calc(100vw * (80 / var(--design-width)));
}

.guide_header {
	height: calc(100vw * (603 / var(--design-width)));
	background: url("/image/sub/bg_guide_header.png") top left no-repeat;
	background-size: cover;
}

/* title_wrapper */
.title_wrapper {
	padding: calc(100vw * (56 / var(--design-width))) 0 0 calc(100vw * (40 / var(--design-width)));
}

.title_wrapper .logo {
	width: calc(100vw * (132 / var(--design-width)));
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.title_wrapper .title {
	font-size: calc(100vw * (36 / var(--design-width)));
	font-weight: 600;
	line-height: 1.2;
}

.guide_section {
	border-top: calc(100vw * (8 / var(--design-width))) solid var(--divide-color);
}

.guide_section--first {
	border-top: none;
}

/* guide_section */
.guide_section .title_group {
	margin-top: calc(100vw * (100 / var(--design-width)));
}

.guide_section .title_group .title {
	font-size: calc(100vw * (32 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (12 / var(--design-width)));
	text-align: center;
}

.guide_section .title_group .desc {
	font-size: calc(100vw * (16 / var(--design-width)));
	margin-bottom: calc(100vw * (12 / var(--design-width)));
	text-align: center;
	padding: 0 calc(100vw * (16 / var(--design-width)));
	line-height: 1.4;
}

/* guide-swiper */
.guide-swiper {
	padding-bottom: calc(100vw * (100 / var(--design-width))) !important;
}

.guide-swiper .step_img {
	width: calc(100vw * (260 / var(--design-width)));
}

.guide-swiper .step_desc {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 600;
	text-align: center;
	padding: 0 calc(100vw * (40 / var(--design-width)));
}

.guide-swiper .item {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
}

.guide-swiper .swiper-pagination {
	bottom: calc(100vw * (60 / var(--design-width))) !important;
}

/* guide_static */
.guide_static {
	display: flex;
	justify-content: center;
}

.guide_static .step_img {
	width: calc(100vw * (342 / var(--design-width)));
}

.loading-text {
	font-size: calc(100vw * (18 / var(--design-width)));
	color: var(--gray-color);
	display: flex;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
	justify-content: center;
	margin-bottom: calc(100vw * (30 / var(--design-width)));
	font-weight: 600;
}

/* dots */
.dots {
	display: flex;
	gap: calc(100vw * (3 / var(--design-width)));
	align-items: center;
}

.dots span {
	display: inline-block;
	width: calc(100vw * (4 / var(--design-width)));
	height: calc(100vw * (4 / var(--design-width)));
	border-radius: 50%;
	background: var(--black-color);
	animation: bounce 1.2s infinite;
}

.dots span:nth-child(2) {
	animation-delay: 0.2s;
}

.dots span:nth-child(3) {
	animation-delay: 0.4s;
}

@keyframes bounce {
	0%, 80%, 100% {
		opacity: 0.3;
		transform: translateY(0);
	}

	40% {
		opacity: 1;
		transform: translateY(-4px);
	}
}

.btn_delivery_inquiry {
	margin: 0 auto;
	width: calc(100vw - (100vw * (32 / var(--design-width))));
}

.common_wrap.featured {
	background: #EAEAE8;
}

/* pw_wrap */
.pw_wrap {
	background-color: var(--background-color);
	height: calc(100dvh - (100vw * (70 / var(--design-width))));
	min-height: auto;
	display: flex;
	flex-direction: column;
	color: var(--black-color);
	gap: calc(100vw * (5 / var(--design-width)));
	padding: 0 calc(100vw * (20 / var(--design-width))) 0;
}

.pw_wrap .title {
	font-weight: 600;
	font-size: calc(100vw * (20 / var(--design-width)));
	display: flex;
	line-height: 1.4;
	font-weight: 600;
	flex-direction: column;
	margin-top: calc(100vw * (20 / var(--design-width)));
	padding-left: 0;
}

.pw_wrap .title.forgot span {
	font-size: calc(100vw * (15 / var(--design-width)));
	font-weight: 400;
}

/* forgot_input_box */
.forgot_input_box {
	display: flex;
	flex-direction: column;
	margin-bottom: calc(100vw * (20 / var(--design-width)));
}

.forgot_input_box input {
	padding: calc(100vw * (14 / var(--design-width)));
	border-radius: calc(100vw * (12 / var(--design-width)));
	background-color: #fff;
	width: 100%;
	margin-top: calc(100vw * (8 / var(--design-width)));
	font-size: calc(100vw * (16 / var(--design-width)));
	min-height: calc(100vw * (62 / var(--design-width)));
	border: 1px solid var(--border-color);
	font-weight: 600;
}

/* signup_inner */
.signup_inner .signup_input {
	width: fit-content;
    max-width: 100%;
    box-sizing: border-box;
    align-items: center;
	display: flex;
	gap: calc(100vw * (8 / var(--design-width)));
	justify-content: center;
	margin: calc(100vw * (40 / var(--design-width))) auto calc(100vw * (20 / var(--design-width)));
}

.signup_inner .signup_input input {
	flex: 0 1 calc(100vw * (58 / var(--design-width)));
    width: calc(100vw * (58 / var(--design-width)));
    min-width: 0;
    height: auto;
    aspect-ratio: 58 / 64;
    box-sizing: border-box;
	border: calc(100vw * (2 / var(--design-width))) solid var(--border-color);
	background: var(--white-color);
	text-align: center;
	font-size: calc(100vw * (36 / var(--design-width)));
	font-weight: 600;
	transition: all 0.2s ease;
	border-radius: calc(100vw * (8 / var(--design-width)));
}

.signup_inner .signup_input input:focus {
	border-color: var(--main-color);
	box-shadow: var(--box-shadow);
	transition: all 0.4s ease;
}
.signup_inner .signup_input input:not(:placeholder-shown) {
	border-color: var(--main-color);
}


.referral_verify_msg {
	text-align: center;
	color: var(--caution-color);
	margin-bottom: calc(100vw * (40 / var(--design-width)));
}

/* signup_wrap */
.signup_wrap .btn_group {
	margin-top: auto;
	display: flex;
	gap: calc(100vw * (6 / var(--design-width)));
}

.signup_wrap .btn_group button {
	flex: 1;
}

.cp_err_msg {
	color: var(--caution-color);
	text-align: center;
	display: none;
}

/* noti_up */
.noti_up {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.noti_up .bg {
	background-color: rgba(0, 0, 0, 0.5);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

.noti_up_box {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	max-height: 80dvh;
	display: flex;
	flex-direction: column;
	width: calc(100% - (100vw * (50 / var(--design-width))));
	background-color: #FFF;
	border-radius: var(--out-radius);
	padding: calc(100vw * (30 / var(--design-width))) calc(100vw * (20 / var(--design-width))) calc(100vw * (20 / var(--design-width)));
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 1;
	transition: transform 0.3s ease;
}

/* noti_btn_group */
.noti_btn_group {
	display: flex;
	width: 100%;
	align-items: center;
	gap: calc(100vw * (6 / var(--design-width)));
}

.noti_btn_group .com_btn {
	flex: 1;
	height: calc(100vw * (52 / var(--design-width)));
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.noti_up.active {
	opacity: 1;
	pointer-events: auto;
}

/* noti_up_box */
.noti_up_box .content_box {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.noti_up_box .content_box .title {
	color: var(--black-color);
	text-align: center;
	font-size: calc(100vw * (18 / var(--design-width)));
	font-weight: 600;
	margin-bottom: calc(100vw * (12 / var(--design-width)));
}

.noti_up_box .content_box .text {
	color: var(--black-color);
	text-align: center;
	font-size: calc(100vw * (14 / var(--design-width)));
	line-height: 1.4;
}

/* my_card_box */
.my_card_box {
	display: flex;
	padding: calc(100vw * (20 / var(--design-width)));
	flex-direction: column;
	align-items: center;
	gap: calc(100vw * (12 / var(--design-width)));
	border-radius: var(--common-radius);
	border: 1px solid var(--border-color);
	background: var(--white-color);
	box-shadow: var(--btn-shadow);
	margin-top: calc(100vw * (12 / var(--design-width)));
}

.my_card_box .card_info_wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

.my_card_box .card_info_group {
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (4 / var(--design-width)));
}

.my_card_box .card_info_group .label {
	font-size: calc(100vw * (13 / var(--design-width)));
	color: var(--gray-color);
	font-weight: 600;
}

.my_card_box .card_info_group .amount_wrap {
	display: flex;
	align-items: baseline;
	gap: calc(100vw * (4 / var(--design-width)));
	font-size: calc(100vw * (24 / var(--design-width)));
	color: var(--black-color);
}

.my_card_box .card_img {
	width: calc(100vw * (25 / var(--design-width)));
	margin-right: calc(100vw * (15 / var(--design-width)));
	overflow: hidden;
	flex-shrink: 0;
}

.my_card_box .btn_card_feature {
	width: 100%;
	height: calc(100vw * (48 / var(--design-width)));
	background-color: var(--box-bg-color);
	border-radius: var(--common-radius);
	color: var(--blaci-color);
	font-size: calc(100vw * (16 / var(--design-width)));
	font-weight: 600;
}

.empty_card .amount_wrap {
	font-weight: 600;
}

/* history_detail */
.history_detail {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 50;
}

.history_detail .slide_up {
	position: fixed;
	width: 100%;
	bottom: 0;
	left: 0;
	padding: 0 calc(100vw * (25 / var(--design-width))) calc(100vw * (35 / var(--design-width)));
	border-radius: 30px 30px 0 0;
	background-color: var(--white-color);
	display: flex;
	flex-direction: column;
	transform: translateY(100%);
	transition: 0.5s;
}

.history_detail .slide_img_box {
	margin: 0 auto;
}

.slide_up .modal_xbtn {
	flex-shrink: 0;
	width: 100%;
	height: calc(100vw * (36 / var(--design-width)));
	position: unset;
	z-index: 3;
	background-image: url("../image/sub/up_x_btn_renew.png");
	background-size: calc(100vw * (40 / var(--design-width))) calc(100vw * (5 / var(--design-width)));
	background-position: center;
	background-repeat: no-repeat;
}

.history_detail .su_tit {
	text-align: center;
	font-weight: 400;
	font-size: calc(100vw * (14 / var(--design-width)));
	margin-top: calc(100vw * (14 / var(--design-width)));
	line-height: 1.25em;
	color: var(--gray-color);
}

.history_detail .su_price {
	margin-top: calc(100vw * (10 / var(--design-width)));
	text-align: center;
	font-weight: 600;
	font-size: calc(100vw * (24 / var(--design-width)));
	line-height: 1.35em;
	color: var(--black-color);
}

.history_detail .row_group {
	font-size: calc(100vw * (14 / var(--design-width)));
	font-weight: 400;
	line-height: 1.25em;
	display: flex;
	flex-direction: column;
	gap: calc(100vw * (32 / var(--design-width)));
	padding-top: calc(100vw * (33 / var(--design-width)));
	margin-top: calc(100vw * (31 / var(--design-width)));
	border-top: 1px solid var(--border-color);
}

.history_detail .row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	color: var(--gray-color);
}

.history_detail .left {
	min-width: calc(100vw * (62 / var(--design-width)));
}

.history_detail .slide_up .right {
	text-align: right;
	font-weight: 600;
	color: var(--black-color);
	padding-left: calc(100vw * (40 / var(--design-width)));
}

.history_detail .com_btn {
	margin-bottom: 0;
	margin-top: calc(100vw * (30 / var(--design-width)));
}

.history_detail .bg {
	width: 100vw;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.5);
	display: none;
}


/*my referral code*/
.btn_copy_referral_code {
	display: flex;
	width: 100%;
	height: calc(100vw * (42 / var(--design-width)));
	padding: 0 calc(100vw * (12 / var(--design-width)));
	justify-content: center;
	align-items: center;
	gap: calc(100vw * (3 / var(--design-width)));
	border-radius: calc(100vw * (8 / var(--design-width)));
	border: 1px solid var(--border-color);
	color: var(--gray-color);
	font-size: calc(100vw * (14 / var(--design-width)));
	margin-top: calc(100vw * (20 / var(--design-width)));
}
.my_referral_code {
	color: var(--main-color);
}
.btn_copy_referral_code::after {
	content: "";
	display: block;
	width: calc(100vw * (20 / var(--design-width)));
	height: calc(100vw * (20 / var(--design-width)));
	background: var(--main-color);
	mask: url("../image/sub/icon_copy_s.svg") no-repeat center / contain;
	-webkit-mask: url("../image/sub/icon_copy_s.svg") no-repeat center / contain;
}
/*End my referral code*/


#container.external_container .contact_wrap .contact_switch {
    top: 0;
}

#container.external_container .etc_content_box .content {
	padding: 0 0 calc(100vw * (60 / var(--design-width)));
}
#container.external_container .etc_content_box p {
    line-height: 1.4;
	padding: 0 0 calc(100vw * (20 / var(--design-width)));
}
#container.external_container .etc_wrap {
    padding-top: calc(100vw * (100 / var(--design-width)));
}