@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);


* { 
	box-sizing:border-box;
	margin:0;
	padding:0;
	word-break:keep-all;
}
html, body {
	position:relative;
	width: 100%;
	min-height: 100vh;
	font-family: "Noto Sans KR", sans-serif;
	line-height:1.3;
	letter-spacing:-.3px;
}
a { 
	text-decoration:none;
}
li { 
	list-style:none; 
}
input, button, select, textarea {
	background:transparent;
	border:none;
	font-family: "Noto Sans KR", sans-serif;
	line-height:1.3;
	letter-spacing:-.3px;
}
label, button, a { 
	cursor:pointer;
}
input { 
	display:block;
	min-width: 0;
}
textarea { 
	resize:none; 
}
table { 
	width: 100%;
	table-layout:fixed;
	border-spacing:0;
	border-collapse:collapse;
}
table *:not(th) { 
	word-break:break-all; 
}
.ui-datepicker {
	z-index: 9999 !important;
}

.wrapper {
	max-width: 360px;
	margin:0 auto;
	padding:56px 0 0;
}
.comPopBg { 
	position:fixed; 
	display:none; 
	width: 100vw;
	height: 100vh;
	top: 0;
	left: 0;
	background:rgba(33,33,33,.7);
	z-index: 10;
}
.inputArea {
	padding:13px 15px 12px;
	background: #FFF;
	border:1px solid #F0F0F0;
	border-radius: 10px;
	font-size: 14px;
	color: #212121;
}
.inputArea::placeholder { 
	color: #999;
}
.inputArea.date_input {
	padding-right:40px;
	appearance: none;
	background-image: url(/Form/_web/images/comDate01.svg);
	background-repeat:no-repeat;
	background-position:right 15px center;
}
.inputArea.fullWid { 
	width: 100%;
}


/* 헤더 시작
------------------------------------------------------ */
header { 
	position:fixed; 
	width: 100%;
	max-width: 360px;	
	height: 56px;	
	top: 0;
	left: 50%;
	transform:translateX(-50%);
	background: #FFF;
	z-index: 5;
}
header .hConBox01 { 
	display:flex;
	align-items:center;
	justify-content:space-between;
	height: 100%;
	padding:0 16px;
}
header .hConBox01 .logo { 
	font-size: 0;
}
header .hConBox01 .logo img { 
	max-width: 100%;
}
header .hConBox01 .hSelLang { 
	display:block; 
	font-size: 0;
}
header .hConBox01 .hSelLang img { 
	max-width: 100%;
}
/* 헤더 끝
------------------------------------------------------ */
/* 공통 팝업 시작
------------------------------------------------------ */
.comPopBox01 { 
	position:absolute; 
	width: 270px;
	max-width: 75%;
	top: 50%;
	left: 50%;
	padding:16px;
	transform:translate(-50%, -50%);
	background: #FFF;
	border-radius: 10px;
}
.comPopBox01 .topBox { 
	position:relative; 
	margin:0 0 7px;
	padding:0 28px;
	text-align: center;
}
.comPopBox01 .topBox .tit01 { 
	font-weight: 700;
	font-size: 16px;
	color: #212121;
}
.comPopBox01 .topBox .popClose { 
	position:absolute; 
	display:block; 
	width: 24px;
	height: 24px;
	top: 50%;
	right: 0;
	margin:-12px 0 0;
}
.comPopBox01 .topBox .popClose:before,
.comPopBox01 .topBox .popClose:after { 
	content:"";
	position:absolute;
	box-sizing:border-box;
	display:block;
	width: 18px;
	height: 2px;
	top: 50%;
	left: 50%;
	margin:-1px 0 0 -9px;
	background: #212121;
	border-radius: 4px;
}
.comPopBox01 .topBox .popClose:before { 
	transform:rotate(45deg);
}
.comPopBox01 .topBox .popClose:after { 
	transform:rotate(-45deg);
}
.comPopBox01 .lnkLst01 li { 
	padding:16px 0 15px;
	border-bottom:1px solid #F0F0F0;
}
.comPopBox01 .lnkLst01 li:last-child { 
	border-bottom:none;
}
.comPopBox01 .lnkLst01 .lstLnk01 { 
	display:flex;
	align-items:center; 
	gap:16px;
	width: 100%;
}
.comPopBox01 .lnkLst01 .lstLnk01 span { 
	display:block;
}
.comPopBox01 .lnkLst01 .lstLnk01 .lnkIco { 
	flex-shrink:0;
	font-size: 0;
}
.comPopBox01 .lnkLst01 .lstLnk01 .lnkIco img { 
	max-width: 100%;
}
.comPopBox01 .lnkLst01 .lstLnk01 .lnkTxt01 { 
	flex-grow:1;
	min-width: 0;
	font-weight: 500;
	font-size: 15px;
	color: #212121;
	transition:all .3s ease;
}
.comPopBox01 .lnkLst01 .lstLnk01:focus .lnkTxt01,
.comPopBox01 .lnkLst01 .lstLnk01:hover .lnkTxt01 { 
	color:#42A5F5;
}
.comPopBox01 .selLst01 { 
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin:16px 0 0;
}
.comPopBox01 .selLst01 li { 
	width: calc((100% - 10px)/2);
}
.comPopBox01 .selLst01 .btnSel { 
	display:flex;
	align-items:center; 
	justify-content:center; 
	width: 100%;
	padding:11px 8px;
	border:1px solid #F0F0F0;
	border-radius: 10px;
	font-size: 0;
	transition:all .3s ease;
}
.comPopBox01 .selLst01 .btnSel:focus,
.comPopBox01 .selLst01 .btnSel:hover { 
	border-color:#28BDFF;
}
.comPopBox01 .chkTxtBox01 { 
	text-align: center;
}
.comPopBox01 .chkTxtBox01 .imgBox { 
	margin:0 0 24px;
	font-size: 0;
}
.comPopBox01 .chkTxtBox01 .imgBox img { 
	max-width: 100%;
}
.comPopBox01 .chkTxtBox01 .txt01 { 
	margin:0 0 9px;
	font-weight: 700;
	font-size: 16px;
	color: #212121;
}
.comPopBox01 .chkTxtBox01 .txt02 {
	font-size: 14px;
	color: #424242;
}
.comPopBox01 .rstBox01 { 
	margin:22px 0 0;
	padding:14px 0 13px;
	border-top:1px solid #F0F0F0;
	border-bottom:1px solid #F0F0F0;
}
.comPopBox01 .rstBox01 dl + dl { 
	margin-top:12px;
}
.comPopBox01 .rstBox01 dt { 
	margin:0 0 5px;
	font-size: 13px;
	color: #797979;
}
.comPopBox01 .rstBox01 dd { 
	font-size: 14px;
	color: #212121;
	word-break:break-all;
}
.comPopBox01 .btmBox { 
	margin:23px 0 0;
}
.comPopBox01 .btmBox .btn { 
	display:block; 
	width: 100%;
	padding:13px 13px 14px;
	background: #28BDFF;
	border:1px solid #28BDFF;
	border-radius: 10px;
	font-weight: 700;
	font-size: 16px;
	letter-spacing: 0;
	color: #FFF;
	transition:all .3s ease;
}
.comPopBox01 .btmBox .btn:focus,
.comPopBox01 .btmBox .btn:hover { 
	background: #FFF;
	color: #28BDFF;
}
/* 공통 팝업 끝
------------------------------------------------------ */