@charset "utf-8";
*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;}
::before,::after{--tw-content:''}
html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
body{margin:0;line-height:inherit}
hr{height:0;color:inherit;border-top-width:1px}
abbr:where([title]){text-decoration:underline dotted}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}
a{color:inherit;text-decoration:inherit;}
b,strong{font-weight:bolder}
code,kbd,samp,pre{font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;font-size:1em}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}
sup{top:-0.5em}
table{text-indent:0;border-color:inherit;border-collapse:collapse}
button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:inherit;color:inherit;margin:0;padding:0}
button,select{text-transform:none}
:-moz-focusring{outline:auto}
:-moz-ui-invalid{box-shadow:none}
progress{vertical-align:baseline}
::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}
[type='search']{-webkit-appearance:textfield;outline-offset:-2px}
::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
summary{display:list-item}
blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}
fieldset{margin:0;padding:0}
legend{padding:0}
ol,ul,menu{list-style:none;margin:0;padding:0}
textarea{resize:vertical}
input::placeholder,textarea::placeholder{opacity:1;color:theme('colors.gray.400',#9ca3af)}
button,[role="button"]{cursor:pointer}:disabled{cursor:default}
img{pointer-events: none;}
img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}
img,video{max-width:100%;height:auto}
[hidden]{display:none}
pre { white-space: pre-line; word-break: break-all; overflow-x: auto !important; }
:root{
	/* 폰트 굵기 설정 */
	--fw-100: 100;
	--fw-200: 200;
	--fw-300: 300;
	--fw-400: 400;
	--fw-500: 500;
	--fw-600: 600;
	--fw-700: 700;
	--fw-800: 800;
	--fw-900: 900;
	/*색상 설정 */
	--white: #fff;
	--black: #000;
	--gray01: #1b1b1b;
	--gray02: #202020;
	--gray03: #2a2a2a;
	--gray04: #3d3d3d;
	--gray05: #aaa;
	--gray06: #8f8f8f;
	--point01: #d72368;
	--point02: #fc4530;

	/* 트랜지션 관련 설정 */
	--transition: all 0.4s;
}
*{
	font-size: 16px;
	font-weight: 400;
	letter-spacing: -0.035rem;;
	font-family: 'SUIT', sans-serif;
	color: var(--white);
	line-height: 1;
}

html, body{
	background-color: var(--black);
}

@media screen and (max-width: 1100px){
	*{ font-size: 15px; }
}
@media screen and (max-width: 900px){
	*{ font-size: 14px; }
}
@media screen and (max-width: 767px){
	*{ font-size: 13px; }
}
@media screen and (max-width: 320px){
	*{ font-size: 12px; }
}
/* wrapper 넓이 설정 */
.wrapper{
	width: 1200px; height: 100%;
	margin: 0 auto;
}

@media screen and (max-width: 1600px){
	.wrapper{
		width: 80%;
	}
}

@media screen and (max-width: 1200px){
	.wrapper{
		width: 90%;
	}
}

/* SEO 블라인드 텍스트 처리 */
.blind{
	overflow:hidden;
	display:inline-block;
	position:absolute;
	z-index:-1;
	border:0;
	width:1px;
	height:1px;
	clip:rect(1px,1px,1px,1px);clip-path:inset(50%)
}
 
/* 버튼 기본 스타일 지정 */
 .btn{
	 display: inline-flex;
	 flex-direction: row;
	 align-items: center;
	 gap: 10px;
	 border-radius: 5px;
	 transition: var(--transition);
	 font-weight: var(--fw-600);
 }
 
 .btn:hover{
	 opacity: 0.8;
 }
 
 .btn.small{
	 padding: 13px 20px;
 }
 
 .btn.medium{
	 padding: 15px 30px;
 }
 
 .btn.large{
	 padding: 17px 30px;
 }
 
 .btn i,
 .btn span{
	 font-size: inherit;
	 font-weight: inherit;
	 color: inherit;
 }
 
 @media screen and (max-width: 767px){
	 .btn.small{
		 padding: 10px 15px;
	 }
	 .btn.medium{
		 padding: 12px 22px;
	 }
 }
 
 
 /* 타이틀 크기 지정 */
.tit-box{
	text-align: center;
}

.tit-box .tit{
	font-size: 3.125rem;
	line-height: 1.3;
	font-weight: var(--fw-800);
	word-break: keep-all;
}

.tit-box .tit strong{
	color:var(--point01);
	font-size:inherit;
	font-weight:inherit;
	line-height:inherit;
}

.tit-box .tit .m_br{
	display:none;
}

.tit-box .tit .small-tit{
	display: block;
	font-size: 1.125rem;
	font-weight: var(--fw-800);
	margin-bottom: 15px;
	background: linear-gradient(to bottom, var(--point01), var(--point02));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	word-break: inherit;
}

.tit-box .sub-tit{
	font-size: 2.5rem;
	line-height: 1.3;
	font-weight: var(--fw-700);
	word-break: keep-all;
}

.tit-box .sub-tit strong{
	color:var(--point01);
	font-size:inherit;
	font-weight:inherit;
	line-height:inherit;
}

.tit-box .desc{
	font-size: 1.125rem;
	line-height: 1.4;
	color: var(--gray05);
	margin-top: 25px;
	word-break: keep-all;
}


@media screen and (max-width: 1400px){
	.tit-box .tit{
		font-size: 2.9375rem;
	}
	
	.tit-box .tit .small-tit{
		font-size: 1.0625rem;
		margin-bottom: 10px;
	}
	
	.tit-box .desc{
		font-size: 1.0625rem;
		margin-top: 20px;
	}
	
	.tit-box .sub-tit{
		font-size: 2.375rem;
	}
}


@media screen and (max-width: 1000px){
	.tit-box .tit{
		font-size: 2.5rem;
		max-width: 85%;
		margin: 0 auto;
	}
	.tit-box .tit .small-tit{
		font-size: 0.9375rem;
		margin-bottom: 7px;
	}
	
	.tit-box .desc{
		font-size: 1rem;
		margin-top: 10px;
	}
	
	.tit-box .sub-tit{
		font-size: 2rem;
	}
}


@media screen and (max-width: 767px){
	.tit-box .tit{
		font-size: 2.25rem;
	}
	.tit-box .tit .small-tit{
		margin-bottom: 5px;
	}
	
	.tit-box .sub-tit{
		font-size: 1.875rem;
	}
}


@media screen and (max-width: 500px){
	.tit-box .tit{
		font-size: 1.875rem;
		max-width: 100%;
	}
	.tit-box .tit .small-tit{
		margin-bottom: 5px;
		font-size: 0.875rem;
	}
	
	.tit-box .desc{
		font-size: 0.9375rem;
		margin-top: 7px;
	}
	
	.tit-box .sub-tit{
		font-size: 1.5rem;
	}
	
}

@media screen and (max-width:420px){
	.tit-box .tit .m_br{
		display:block;
	}
}