@charset 'utf-8'; 
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@font-face {
	font-family: 'NeueKaine';
	src: url('../css/fonts/neue-kaine-variable.ttf') format('truetype');
}
/* reset */
html:root{border:none} 
html, body{width:100%; height:100%; margin:0; padding:0; -webkit-text-size-adjust:none;}
html{overflow-y:scroll}
body{min-width:270px;  background:#0B0C0E; font-size:1em; font-weight:300; font-family:'Pretendard', arial, sans-serif; font-style: normal; color:#fff; word-break:keep-all; word-wrap:break-word}
table, pre, input, select, textarea, button{font-size:1em; line-height:1.5em; font-family:'Pretendard', arial, sans-serif; color:inherit; word-break:keep-all; word-wrap:break-word}

html, body, article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, 
div, dl, dt, dd, ul, ol, li, p, a, span,
h1, h2, h3, h4, h5, h6, 
form, fieldset, input, label, button, select, textarea, 
table, tbody, thead, th, td, details, pre, address, blockquote,  strong, b, i, em{margin:0; padding:0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box}
  @media all and (max-width:950px){
    body{font-size:0.938em}
  }

article, aside, details, figcaption, figure, footer, header, hgroup, nav, menu, section{display:block}
h1, h2, h3, h4, h5, h6{font-size:1em; font-weight:400}
img, fieldset{max-width:100%; border:0; vertical-align:top}

a{background:transparent; color:inherit; text-decoration:none; cursor:pointer; vertical-align:top; outline:none}
a:hover{text-decoration:none}
a:focus, img:focus, input:focus, button:focus{outline:0;}

input::placeholder{color:#888 !important; opacity:1}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0px 1000px #171717 inset;
	box-shadow: 0 0 0px 1000px #171717 inset;
	transition: background-color 5000s ease-in-out 0s;
	-webkit-text-fill-color:white;
}
table{border-collapse:collapse; border-spacing:0}
ol, ul, li{list-style:none}

caption{display:none; text-indent:-9999px}
caption:after{display:block; clear:both; content:''}
caption{text-align:left}
caption legend{width:0; height:0; line-height:0; overflow:hidden; visibility:hidden; font-size:0}
 
blockquote, q{quotes:none}
blockquote::before, blockquote::after, q::before, q::after{content:''; content:none}
 
hr{display:none}

b, strong{font-weight:bold}
b, strong, i{vertical-align:top}
address, caption, cite, code, dfn, em, i, strong, var{margin:0; padding:0; font-style:normal; }

/* reset forms */
legend{position:absolute; left:-99999px}
input[type="text"] {-webkit-border-radius:0; color:#fff; height:56px; line-height: 56px; border-width:0 0 1px 0; width:100%; background:transparent;}
input[type="text"] , input[type="password"] , input[type="tel"] , input[type="button"] , input[type="submit"]{-webkit-appearance:none}
select{margin:0; padding:0; -webkit-border-radius:0; vertical-align:middle; cursor:pointer; }
button{border:0 none; cursor:pointer; overflow:visible; -webkit-appearance:none}
textarea{-webkit-border-radius:0; appearance:none; -webkit-appearance:none; -moz-appearance:none; }


/* Forms style*/
input::placeholder{color:#999; opacity:1}
input::-webkit-input-placeholder{color:#999;} 
input:-ms-input-placeholder{color:#999;}
input:-moz-input-placeholder{color:#999;}
.font-neue {}

:root{
  --mv-tit-3xl: 84px;
  --mv-tit-2xl: 64px;
  --tit-xl: 56px;
  --tit-lg: 25px;
  --txt-sm: 13px;
  --txt-md: 15px;
  --txt-lg: 17px;

  --primary: #F64E6A;
  --primary-light: #FF6584;
  --sub_color: #FFC2CE;

  --dark: #0B0C0E;
  --white: #fff;
  --white6: rgba(255, 255, 255, 0.6);
  --white8: rgba(255, 255, 255, 0.8);
}

@media (max-width: 1200px){
  :root{
    --mv-tit-3xl: 62px;
    --mv-tit-2xl: 48px;
    --tit-xl: 34px;
    --tit-lg: 18px;
    --txt-sm: 13px;
    --txt-md: 15px;
    --txt-lg: 15px;
  }
}
@media (max-width: 768px){
	:root{
		--mv-tit-2xl: 28px;
	}
}
@media (max-width: 480px){
  :root{
    --mv-tit-3xl: 42px;
    --mv-tit-2xl: 28px;
    --tit-xl: 24px;
    --tit-lg: 18px;
    --txt-sm: 13px;
    --txt-md: 14px;
    --txt-lg: 15px;
  }
}

.keyShow {position: absolute; top: 0; right: 0; width: 30px; height: 100%; display: none; cursor: pointer; background: url(../img/common/icon-eye-bk.svg) no-repeat right 50%; background-size: 20px}
.keyShow.view {background: url(../img/common/icon-eye-off-bk.svg) no-repeat right 50%; background-size: 20px}
.keyShow span {font-size: 0; text-indent: -9999em; overflow: hidden;}

.btn_prim_01 {display:block; height:37px; line-height: 37px; background-color:var(--primary-light); width:190px; text-align: center; color:#fff; font-size:16px;}
.btn_black_01 {display:block; height:37px; line-height: 37px; background-color:var(--dark); border:1px solid #091133; width:190px; text-align: center; color:#fff; font-size:16px;}

.btn_blur_01 {display:block; height:56px; line-height: 56px; background-color:rgba(255, 255, 255, 0.3);-webkit-backdrop-filter: blur(40px); backdrop-filter: blur(40px); border-radius: 28px; width:240px; text-align: center; color:#fff; font-size:15px; transition: 0.3s;}
.btn_blur_01:hover {background-color:rgba(255, 255, 255, 0.5);}
.btn_blur_01:disabled {opacity: 0.5; cursor: default}

.btn_line_01 {display:block; height:56px; line-height: 56px; background:rgba(11, 12, 14, 0.5); border:1px solid var(--primary); border-radius: 28px; width:240px; text-align: center; color:var(--primary); font-size:15px; transition: 0.2s;}
.btn_line_01:hover {background:#f64e6a; color:#fff;}
.btn_line_01:disabled {opacity: 0.5; cursor: default}

.btn_line_02 {display:block; height:56px; line-height: 56px; background:transparent; border:1px solid var(--white); border-radius: 28px; width:240px; text-align: center; color:var(--white); font-size:15px; transition: 0.2s;}
.btn_line_02:hover {background:#fff; color:#0b0c0e;}
.btn_line_02:disabled {opacity: 0.5; cursor: default}

.btn_solid_62 {display:block; height:62px; line-height: 62px; background:var(--primary); border:1px solid var(--primary); border-radius: 50px; width:240px; text-align: center; color:var(--white); font-size:26px; transition: 0.2s;}
.btn_solid_62:hover {background:#fb627c; border:1px solid #fb627c; color:#fff;}
.btn_solid_62:disabled {opacity: 0.5; cursor: default}

.btn_solid_01 {display:block; height:92px; line-height: 92px; background:var(--primary); border:1px solid var(--primary); border-radius: 50px; width:240px; text-align: center; color:var(--white); font-size:30px; transition: 0.2s;}
.btn_solid_01:hover {background:#fb627c; border:1px solid #fb627c; color:#fff;}
.btn_solid_01:disabled {opacity: 0.5; cursor: default}

@media (max-width: 1240px){
	.btn_solid_01 {display:block; height:50px; line-height: 50px; background:var(--primary); border:1px solid var(--primary); border-radius: 50px; width:240px; text-align: center; color:var(--white); font-size:16px; transition: 0.2s;}
	.btn_solid_01:hover {background:#fb627c; border:1px solid #fb627c; color:#fff;}
	.btn_solid_01:disabled {opacity: 0.5; cursor: default}

	.btn_solid_62 {display:block; height:50px; line-height: 50px; background:var(--primary); border:1px solid var(--primary); border-radius: 50px; width:240px; text-align: center; color:var(--white); font-size:16px; transition: 0.2s;}
	.btn_solid_62:hover {background:#fb627c; border:1px solid #fb627c; color:#fff;}
	.btn_solid_62:disabled {opacity: 0.5; cursor: default}

}

.btn_solid_line01{position: relative; display:inline-block; height:56px; line-height: 56px; background:transparent; text-align: center; padding:0 20px; color:var(--white); height:56px; line-height: 56px;border-radius: 50px; border: 1px solid #9f6c98;}
/*.btn_solid_line01:after {content:''; position: absolute; height:56px; line-height: 56px; inset: 0; background:transparent; border:1px solid; border-image-slice: 1;  font-size:15px; transition: 0.2s; border-radius: 50px; !*1*!*/
/*	border: 1px solid #9f6c98; !*2*!*/
/*	background: linear-gradient(45deg,#FF7388,#7664E4) border-box; !*3*!*/
/*	mask: !*4*!*/
/*			linear-gradient(#000 0 0) padding-box,*/
/*			linear-gradient(#000 0 0);*/
/*-webkit-mask-composite: exclude;mask-composite: exclude;*/}

.btn_solid_02 {display:block; height:56px; line-height: 56px; background:#333437; border:1px solid #333437; border-radius: 28px; width:240px; text-align: center; color:var(--white); font-size:15px; transition: 0.2s;}
.btn_solid_02:hover {background:#333437; border:1px solid #333437; color:#fff;}
.btn_solid_02:disabled {cursor: default}

.btn_blur_s01 {display:block; height:56px; line-height: 56px; background-color:rgba(255, 255, 255, 0.3);-webkit-backdrop-filter: blur(40px); backdrop-filter: blur(40px); border-radius: 20px; width:160px; text-align: center; color:#fff; font-size:15px; transition: 0.3s;}
.btn_blur_s01:hover {background-color:rgba(255, 255, 255, 0.5);}
.btn_blur_s01:disabled {opacity: 0.5; cursor: default}

.btn_line_s01 {display:block; height:56px; line-height: 56px; background:rgba(11, 12, 14, 0.5); border:1px solid var(--primary); border-radius: 20px; width:160px; text-align: center; color:var(--primary); font-size:15px; transition: 0.2s;}
.btn_line_s01:hover {background:#f64e6a; color:#fff;}
.btn_line_s01:disabled {opacity: 0.5; cursor: default}

.btn_line_s02 {display:block; height:56px; line-height: 56px; background:transparent; border:1px solid var(--white); border-radius: 20px; width:160px; text-align: center; color:var(--white); font-size:15px; transition: 0.2s;}
.btn_line_s02:hover {background:#fff; color:#0b0c0e;}
.btn_line_s02:disabled {opacity: 0.5; cursor: default}

/* checkbox */
.checks {line-height: 13px;}
.checks input[type="checkbox"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);	border: 0;}
.checks input[type="checkbox"] + label {display: inline-block;position: relative; cursor: pointer;-webkit-user-select: none;-moz-user-select: none;	-ms-user-select: none; padding-left:30px;}
.checks input[type="checkbox"] + label:before {	content: '';	position: absolute;	left: 0;top: 50%;transform: translateY(-50%);width: 20px;height: 20px;	min-height: 20px;	text-align: center; background: transparent url(../img/common/icon_check_20s.svg) no-repeat center; background-size:14px auto;	border: 1px solid #d1d1d1;	border-radius: 5px;}
.checks input[type="checkbox"]:disabled + label {cursor:default;}
.checks input[type="checkbox"]:disabled + label::before {background:transparent;}
.checks input[type="checkbox"]:checked + label::before {background:transparent; border-color:#be3455;}
.checks input[type="checkbox"]:checked + label::after {content: ''; position: absolute; left:0; top:50%; transform:translateY(-50%); width:20px; height:20px; border: 1px solid var(--primary); border-radius:5px; background:var(--primary) url(../img/common/icon_check_20s.svg) no-repeat center; background-size:14px auto;}
.checks input[type="checkbox"] + label i {font-size:0;}
.cchkbox .checks input[type="checkbox"] + label { padding-left: 18px; }
.write_form .checks input[type="checkbox"] + label { padding-left: 26px; }
.cchkbox1 .checks span {width:180px; display:inline-block}

.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb40 {margin-bottom:40px !important;}
.mt20 {margin-top:20px !important;}
.mt40 {margin-top:40px !important;}
.w100p {width:100%}
.w50p {width:50%}
.font30 {font-size:30px}
.fontw700 {font-weight: 700}
.color_point {color:var(--primary)}

.flex {display:flex;}
.alignitem_center {align-items: center}
.justify_center {justify-content: center}
.justify_btw {justify-content: space-between}

.text_gradient {
	background-image: linear-gradient(to right, #FF7388, #7664E4);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent !important;}

/* radio */
.checks_radio {position: relative;width:100%;}
.checks_radio label {width: 100%;display: block;text-align: left;cursor: pointer;position: relative;z-index: 2;overflow: hidden;}
.checks_radio label:after {width: 30px;height: 30px;content: "";background-color: #fff;border-radius: 50%;z-index: 2;position: absolute;right: 0;top: 50%;transform: translateY(-50%);cursor: pointer;}
.checks_radio input:checked ~ label:after {background:#fff url("/assets/img/common/icon_radio_on.png")no-repeat center;}
.checks_radio input {width: 30px;height: 30px;z-index: 2;position: absolute;right: 30px;top: 50%;transform: translateY(-50%);cursor: pointer;visibility: hidden;}

@media (max-width: 780px){
	.checks_radio label:after {width:24px; height:24px;}
}
