#box{width:500px;height:704px;word-break:break-all;padding:110px 55px 30px 0;font-size:20px;font-family:cc;position:relative;background:#fff;border-radius:10px 0 0 10px}

#box.m6,
#box.m10,
#box.m17{padding-right:40px}
#box.m6 .hue,
#box.m10 .hue,
#box.m17 .hue{width:47px}

#box.m8,
#box.m13,
#box.m18{padding-right:52px}
#box.m8 .hue,
#box.m13 .hue,
#box.m18 .hue{width:50px}

#box.m12,
#box.m20{padding-right:84px}
#box.m23,
#box.m24,
#box.m25,
#box.m26{padding-right:190px}
#name_list {
	height: 200px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain; /* 스크롤 이벤트 전파 방지 */
	scrollbar-width: thin; /* Firefox */
	scrollbar-color: rgba(0,0,0,0.3) transparent; /* Firefox */
	scroll-behavior: smooth;
	position: relative;
	z-index: 10;

	user-select: none; /* 텍스트 선택 방지 */
	touch-action: pan-y; /* 수직 스크롤만 허용 */
	will-change: scroll-position; /* 스크롤 성능 최적화 */
	isolation: isolate; /* 새로운 쌓임 맥락 생성 */
}
#name_list::-webkit-scrollbar {
	width: 8px;
}

#name_list::-webkit-scrollbar-thumb {
	background-color: rgba(0,0,0,0.3);
	border-radius: 4px;
}

div.ui-datepicker{
	font-size:12px;
}
#datepicker {
	display: flex;
	justify-content: center;
}
.ui-datepicker .ui-datepicker-calendar td {
	line-height: 1;
}

#chok-box.m3{padding-right:85px}

#chok-box.m6,
#chok-box.m10,
#chok-box.m17{padding-right:40px}
#chok-box.m6 .hue,
#chok-box.m10 .hue,
#chok-box.m17 .hue{width:47px}

#chok-box.m8,
#chok-box.m13,
#chok-box.m18{padding-right:52px}
#chok-box.m8 .hue,
#chok-box.m13 .hue,
#chok-box.m18 .hue{width:50px}

#chok-box.m12,
#chok-box.m20{padding-right:84px}
#chok-box.m23,
#chok-box.m24,
#chok-box.m25,
#chok-box.m26{padding-right:190px}

@font-face{font-family:'cc';src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@1.0/ChosunKm.woff') format('woff');font-weight:normal;font-style:normal}
#chok-box{
	width:500px;
	height:704px;
	word-break:break-all;
	padding:0;
	font-size:20px;
	font-family:cc;
	font-weight:400;
	position:absolute;
	background:#fff;
	z-index:777;
	-webkit-font-smoothing: auto;
}
.hue-wrapper {
	width: 100%;
	height: 100%;
	font-family: cc;
	padding: 110px 55px 30px 0;
	font-weight: 400;
}
.hue-wrapper .p{
	padding: 0 0 15px;
}
.hue,
.huebox {
	line-height: 20px;
}
.huebox { width: 30px;}
.chok-box-wrapper {
	flex-basis: 500px;
	max-width: 500px;
	width: 500px;
	height: 704px;
	--bs-gutter-x: 0;
}

.print-chok {
	font-weight: 400;
}

#name_list.gary,
#name_list.disabled,
#chok-input-panel.disabled,
#chok-gwangye-selector.disabled,
#hoching-container.disabled {
	pointer-events: none;
	opacity: 0.5;
}
.bg{position:absolute;top:0;left:0;width:100%;height:100%;background:url('/wp-content/uploads/2024/01/bg.png') no-repeat top;background-size:100% 100%;-webkit-print-color-adjust:exact;filter:grayscale(1);opacity:.5;z-index: 2}

@media print {
	/* Small */
	html.chok-sm {
		width: 4cm;
		height: 19cm;
	}

	#chok-box {
		width: 720px;
		height: 1050px;
		padding: 150px 80px 30px 0;
		font-size: 30px;
		line-height: 1;
	}

	#chok-box {
		left: 50% !important;
		top: 50% !important;
		transform: translate(-50%, -50%);
	}

	#box { width: 100%; }

	#box.m3{padding-right:120px}

	#box.m6,
	#box.m10,
	#box.m17{padding-right:50px}
	#box.m6 .hue,
	#box.m10 .hue,
	#box.m17 .hue{width:69px !important}

	#box.m8,
	#box.m13,
	#box.m18{padding-right:60px}
	#box.m8 .hue,
	#box.m13 .hue,
	#box.m18 .hue{width:76px !important}

	#box.m12,
	#box.m20{padding-right:118px}

	#box.m23,
	#box.m24,
	#box.m25,
	#box.m26{padding-right:280px}

	#box .hue{float:right;width:82px !important}
	#box .huebox{width:30px !important;float:right}
	#box .t span{display:block;margin:20px 0}
	#box .p{padding:0 0 20px;width:26px;text-align:center}


	.hue,
	.huebox {
		line-height: 30px;
	}

	#chok-box .hue {
		font-size: 30px;
	}

	/* Large */
	html.chok-lg {
		width: 6cm;
		height: 22cm;
	}

	#header-wrapper,
	.page-title-wrap,
	.breadcrumb-wrap,
	.page-content-title,
	footer.footer-type1 {
		display: none;
	}
	body,
	.container_wrap,
	.page-content-wrap,
	.page-content,
	.page-content>.row {
		height: 100vh;
		overflow: hidden;
	}
	.page-content-wrap {
		padding-top: 0;
	}
	.page-content>.row>:not(:first-child) {
		display: none;
	}
	.chok-box-wrapper {
		width: auto;
	}
	#chok {
		position: absolute;
		left: 0;
		top: 0;
	}
	#chok-box {
		position: fixed !important;
		left: 0;
		padding-right: 0 !important;
	}
	#chok .p{padding:0 0 20px;width:26px;text-align:center}
	#box .bg {
		background-image: none;
	}
}

.typeList .row>* {
	--bs-gutter-x: 0;
}
.p{padding:0 0 15px;width:16px;text-align:center}
.pd{height:20px}
.hue{float:right;width:57px}
.huebox{width:20px;float:right}