@charset "utf-8";

/* 폰트 */
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@200;300;400;600;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Urbanist: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');
@import url('https://fonts.googleapis.com/css2?family=Montserrat: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');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');


/* 요소(element) 여백 초기화  */
html{background:#fff;}
html,body,div,h1,h2,h3,h4,h5,h6,p,span,ul,ol,dl,dt,dd,form{margin:0; padding:0;}
body {color:#000;min-width:320px; height:100%; font-size:14px; font-family:'Pretendard','Noto Sans KR',Sans-serif; font-weight: 400;letter-spacing: 0; -webkit-text-size-adjust: 100%;}
a {color:#000; -webkit-tap-highlight-color: transparent;}
a, a:link {text-decoration: none;}
a:hover, a:active, a:focus { text-decoration:none; }
img {border:0; vertical-align:top;}
button {-webkit-tap-highlight-color: transparent; color: #222;}
label {-webkit-tap-highlight-color: transparent;}

/* 목록 */
ol, ul {list-style:none;}

/* 텍스트 관련 요소 초기화 */
address, caption, cite {font-weight:normal; font-style:normal;}
em {font-style:italic;}

/* 테두리 없애기 */
fieldset, img, abbr, acronym { border:none; margin:0; padding:0;} 

/* 테이블 - 마크업에 'cellspacing="0"' 지정 함께 필요 */
table { border-collapse:collapse; border-spacing:0;}

/* 수평선*/
hr { display:none; }

*, *::after, *::before {box-sizing:border-box}
input[type=text], input[type=button], input[type=password], textarea, button {outline-style:none; -webkit-appearance:none; -webkit-border-radius:0; font-family: inherit; border: 0;}
select{background:#fff;}
input[type=checkbox], input[type=radio]{border:1px solid #666;}
body.hide {overflow-x: hidden;}
button {border: 0; background: transparent; padding: 0; cursor: pointer;}
input[type=text]::-webkit-input-placeholder {color:#aaa;}
input[type=text]:-moz-placeholder {color:#aaa;opacity:1;}
input[type=text]::-moz-placeholder {color:#aaa;opacity:1;}
input[type=text]:-ms-input-placeholder {color:#aaa;}
input[type=password]::-webkit-input-placeholder {color:#aaa;}
input[type=password]:-moz-placeholder {color:#aaa;opacity:1;}
input[type=password]::-moz-placeholder {color:#aaa;opacity:1;}
input[type=password]:-ms-input-placeholder {color:#aaa;}


/* 전역클래스 */
.hidden {
	position:absolute; 
	top:-10000em; 
	overflow:hidden; 
	height:0px; 
	width:0px;
}
.dt_none {
	display:none;
}
.fl {
	float:left;
}
.fr {
	float:right;
}
.ta_c {
	text-align:center; 
}
.ta_r {
	text-align:right; 
}
.ta_l {
	text-align:left; 
}
.va_m {
	vertical-align:middle;
}
.clear_box {
	overflow:hidden; 
}
.clear:after {
	content: ''; 
	display: block; 
	clear: both;
}
.pd50 {
	padding: 0 50px;
}
.pdb50 {
	padding: 0 50px 50px;
}
.bradius {
	border-radius: 50%;
}
.bradius5 {
	border-radius: 5px;
}
.bradius10 {
	border-radius: 10px;
}
.bradius15 {
	border-radius: 15px;
}
.bradius20 {
	border-radius: 20px;
}
.bradius25 {
	border-radius: 25px;
}
.bradius30 {
	border-radius: 30px;
}
.black-btn4 {
	background: #444;
	color: #fff;
}
.black-btn5 {
	background: #555;
	color: #fff;
}
.black-line-btn {
	border: 2px solid #c9c9c9;
	color: #333;
}
.red-box {
	background: #ef0d2c;
	color: #fff;
}
.gray-bg {
	background: #eee;
}
.white-bg {
	background: #fff;
}
.block {
	display: block;
}
.i-block {
	display: inline-block;
}
.w100 {
	width: 100%;
}
.table {
	display: table;
}
.row {
	display: table-row;
}
.cell {
	display: table-cell;
}
.ch-box input[type=checkbox] {
	display: none;
}
.ch-box input[type=checkbox] + label {
	position: relative;
	font-size: 32px;
	cursor: pointer;
}
.ch-box input[type=checkbox] + label:before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 50px;
	height: 50px;
	background: #aaa url("../../images/ico-check.png")no-repeat 50% 50% / auto 26px;
	border-radius: 10px;
	margin-right: 10px;
}
.ch-box input[type=checkbox]:checked + label:before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 50px;
	height: 50px;
	background: #ef0d2c url("../../images/ico-check.png")no-repeat 50% 50% / auto 26px;
	border-radius: 10px;
	margin-right: 10px;
}
.flex {
	display: flex;
}
.red {
	color: #ed2024;
}
.grid {
	display: grid;
}