@charset "utf-8";
/* Reset */
:where(:not(html,iframe,canvas,img,svg,video,audio):not(svg *,symbol *)) {all:unset; display:revert;}
*, ::after, ::before {box-sizing:border-box;}
a, button {cursor:revert;} 
menu, ol, ul {list-style:none;}
/* img {max-inline-size:100%; max-block-size:100%;} */
table {border-collapse:collapse;}
input, textarea {-webkit-user-select:auto; user-select:auto;}
textarea {white-space:revert;}
meter{-webkit-appearance:revert; appearance:revert;}
:where(pre) {all:revert;}
::placeholder {color:unset;}
::marker {content:initial;}
:where([hidden]) {display:none;}
:where([contenteditable]:not([contenteditable=false])) {-moz-user-modify:read-write; -webkit-user-modify:read-write; overflow-wrap:break-word; line-break:after-white-space; -webkit-user-select:auto; user-select:auto;}
:where([draggable=true]) {-webkit-user-drag:element;}
:where(dialog:modal){all:revert;}

/* Global Style */
	/* Font */
		@font-face {
			font-family: 'Spoqa Han Sans Neo';
			font-weight: 700;
			src: local('Spoqa Han Sans Neo Bold'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Bold.woff2') format('woff2'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Bold.woff') format('woff'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Bold.ttf') format('truetype');
		}
	
	
		@font-face {
			font-family: 'Spoqa Han Sans Neo';
			font-weight: 500;
			src: local('Spoqa Han Sans Neo Medium'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Medium.woff2') format('woff2'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Medium.woff') format('woff'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Medium.ttf') format('truetype');
		}
	
		@font-face {
			font-family: 'Spoqa Han Sans Neo';
			font-weight: 400;
			src: local('Spoqa Han Sans Neo Regular'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Regular.woff2') format('woff2'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Regular.woff') format('woff'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Regular.ttf') format('truetype');
		}
	
		@font-face {
			font-family: 'Spoqa Han Sans Neo';
			font-weight: 300;
			src: local('Spoqa Han Sans Neo Light'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Light.woff2') format('woff2'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Light.woff') format('woff'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Light.ttf') format('truetype');
		}
		
	/* Root */
		:root {
			--initw: 1280px; /* 레이아웃 넓이 */
			--initwpad: 5.12vw; /* 모바일 안쪽여백 */
			--initff: "Spoqa Han Sans Neo"; /* 글자체 */
			--initfs: 16px; /* 글자 크기 */
			--initls: -0.020em; /* 자간 */
			--initlh: 150%; /* 행간 */
			--initcr: #747878; /* 기본 폰트 컬러 */
				
			--notch: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); /* 아이폰 노치 대응 */
			
			--mc: #3B4ED6; /* 메인 컬러 */
			--youtube-red: #3B4ED6; /* 동영상 메인 컬러 */
			--moc: #00189A; /* 메인 오버 컬러 */
			--mlc: #F9F9FC; /* 밝은 메인 컬러 */
			--mic: #FF5449; /* 강조 컬러 */

			--fomh: 60px; /* 높이 */
			--fomlh: calc(var(--fomh) - 2px); /* 폼 행간 */
			--fompad: 16px; /* 좌우 여백 */
			--fomfs: var(--initfs); /* 폰트 크기 */
			--fombr: 5px; /* 테두리 굴곡 */
			--fomfc: #ABAAB4; /* 텍스트 컬러 */
			--fombg: #EFF1F1; /* 폼 배경 */
			--fomdisbg: #eee; /* 비활성 배경 */
			--fomdisbdr: #ddd; /* 비활성 테두리 색상 */
			--fombdr: var(--fombg); /* 테두리 색상 */
			--fomchkicow: 12px; /* 체크박스 아이콘 넓이 */
			--fomchkicoh: 10px; /* 체크박스 아이콘 높이 */
			--fomchkrdosz: 28px; /* 체크박스, 라디오 크기 */
			--fomchkrdosz2: 24px; /* 체크박스, 라디오 크기 */
			--fomrdogap: 10px; /* 라디오 선택 시 안쪽 갭 */
			--fomph: #ccc; /* 플레이스홀더 컬러 */
			--fomtah: 120px; /* 텍스트 에어리어 높이 */
			--fomrgbg: var(--mc); /* Range 타입 배경 */
			--fomrgthbbg: var(--moc); /* Range 타입 컨트롤 배경 */
			--fomrgh: 5px; /* Range 타입 배경 높이 */
			--fomrgthbsz: 16px; /* Range 타입 컨트롤크기 */
			--fomdropitem: 4.5; /* 드롭다운 아이템 노출 개수 */
			
			--btnfs: 18px; /* 버튼 폰트 크기 */
			--btndisbg: #A9ACAC; /* 버튼 Disabled */
			
			--scrw: 10px; /* 스크롤바 넓이 */
			--scrbg: transparent; /* 스크롤바 배경 */
			--scrtmbbg: #C4C7C7; /* 스크롤 배경 */
			
			--cico: url('../../images/common_icon.png') no-repeat; /* 공통 아이콘 이미지 경로 */
			--ico: url('../../images/icon.png') no-repeat; /* 일반 아이콘 이미지 경로 */
			--icosz: 1000px; /* 아이콘 이미지 크기(가로x세로) */

		}
	
		@font-face {
			font-family: 'Spoqa Han Sans Neo';
			font-weight: 100;
			src: local('Spoqa Han Sans Neo Thin'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Thin.woff2') format('woff2'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Thin.woff') format('woff'),
			url('../fonts/SpoqaHanSansNeo/SpoqaHanSansNeo-Thin.ttf') format('truetype');
		}

		@font-face {
			font-family: 'Noto Sans KR';
			font-style: normal;
			font-weight: 100;
			src: url('../solution/font/NotoSansKR-Thin.woff2') format('woff2'),
			url('../solution/font/NotoSansKR-Thin.woff') format('woff'),
			url('../solution/font/NotoSansKR-Thin.otf') format('opentype');
		}

		@font-face {
			font-family: 'Noto Sans KR';
			font-style: normal;
			font-weight: 300;
			src: url('../solution/font/NotoSansKR-Light.woff2') format('woff2'),
			url('../solution/font/NotoSansKR-Light.woff') format('woff'),
			url('../solution/font/NotoSansKR-Light.otf') format('opentype');
		}

		@font-face {
			font-family: 'Noto Sans KR';
			font-style: normal;
			font-weight: 400;
			src: url('../solution/font/NotoSansKR-Regular.woff2') format('woff2'),
			url('../solution/font/NotoSansKR-Regular.woff') format('woff'),
			url('../solution/font/NotoSansKR-Regular.otf') format('opentype');
		}

		@font-face {
			font-family: 'Noto Sans KR';
			font-style: normal;
			font-weight: 500;
			src: url('../solution/font/NotoSansKR-Medium.woff2') format('woff2'),
			url('../solution/font/NotoSansKR-Medium.woff') format('woff'),
			url('../solution/font/NotoSansKR-Medium.otf') format('opentype');
		}

		@font-face {
			font-family: 'Noto Sans KR';
			font-style: normal;
			font-weight: 700;
			src: url('../solution/font/NotoSansKR-Bold.woff2') format('woff2'),
			url('../solution/font/NotoSansKR-Bold.woff') format('woff'),
			url('../solution/font/NotoSansKR-Bold.otf') format('opentype');
		}

		@font-face {
			font-family: 'Noto Sans KR';
			font-style: normal;
			font-weight: 900;
			src: url('../solution/font/NotoSansKR-Black.woff2') format('woff2'),
			url('../solution/font/NotoSansKR-Black.woff') format('woff'),
			url('../solution/font/NotoSansKR-Black.otf') format('opentype');
		}

/* Pretendard-Regular */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:normal;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-Regular.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-Regular.woff') format('woff');
}

/* Pretendard-Thin */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:100;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-Thin.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-Thin.woff') format('woff');
}

/* Pretendard-ExtraLight */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:200;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-ExtraLight.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-ExtraLight.woff') format('woff');
}

/* Pretendard-Light */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:300;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-Light.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-Light.woff') format('woff');
}

/* Pretendard-Medium */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:500;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-Medium.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-Medium.woff') format('woff');
}

/* Pretendard-SemiBold */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:600;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-SemiBold.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-SemiBold.woff') format('woff');
}

/* Pretendard-Bold */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:bold;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-Bold.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-Bold.woff') format('woff');
}

/* Pretendard-Black */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:900;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-Black.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-Black.woff') format('woff');
}

/* Pretendard-ExtraBold */
@font-face {
	font-family:'PretendardGOV';
	font-style:normal;
	font-weight:bold;
	src: url('../fonts/PretendardGOV/woff2/PretendardGOV-ExtraBold.woff2') format('woff2'),
	url('../fonts/PretendardGOV/woff/PretendardGOV-ExtraBold.woff') format('woff');
}


	/* General */
		html {overflow-x:hidden; width:100%; height:100vh; padding:var(--notch); scroll-behavior:smooth;}
		body {display:flex; flex-direction:column; /*justify-content: space-between;*/ height: 100%; background:white; /* height:100vh; height:100dvh; */ font-family:var(--initff); font-size:var(--initfs); line-height:var(--initlh); letter-spacing:var(--initls); color:var(--initcr);}
		::selection {background-color:var(--mc); color:white;}
		
	/* Contents */
		a {text-decoration:none; color:inherit;}
		b {font-weight:500;}
		strong {font-weight:700;}
		small {font-size:80%;}
		img {vertical-align:top;}
		em {color:var(--mic);}

	/* Form */
		select,
		button,
		textarea,
		input[type="text"],
		input[type="password"] {appearance:none; background:none; border:none; padding:0; font-family:var(--initff); font-size:inherit; font-weight:inherit; letter-spacing:var(--initls); color:inherit; outline:0;}

		input[type="text"],
		input[type="password"],
		input[type="date"],
		input[type="search"],
		input[type="number"],
		input[type="time"],
		input[type="color"],
		input[type="datetime-local"],
		input[type="email"],
		input[type="month"],
		input[type="range"],
		input[type="url"],
		input[type="week"],
		select,
		textarea {width:100%; caret-color:var(--mc);}
		.textarea { padding: 15px;}

		input[type="text"],
		input[type="password"],
		*::placeholder {color:inherit;}

		button,
		select,
		input[type="color"],
		input[type="range"],
		input[type="reset"],
		input[type="submit"],
		input[type="button"],
		::-webkit-calendar-picker-indicator {cursor:pointer;}
		input[type=range]::-webkit-slider-thumb {appearance:none; border-radius:50%;}
		label {display:inline-flex;}

		legend, caption {position:fixed; left:-100vw;}

		table {table-layout:fixed; width:100%;}