@charset "utf-8";

/* @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.5/dist/web/static/pretendard-dynamic-subset.css'); */

a {
	text-decoration: none;
	color: inherit;
	font-family: inherit;
}

.layout-top1 {
	background: #2D3E4F;
	height: 35px;
	line-height: 35px;
}

.layout-top1 .top1 {
	width: 1000px;
	margin: 0 auto;
	color: #FFF;
	text-align: right;
}

.layout-top1 .top1 a {
	color: #FFF;
}

.layout-top1 .top1 a:hover {
	text-decoration: underline;
}

.layout-top1 .top1 span {
	margin: 0 10px;
}

.layout-top2 {
	background: #FFF;
}

.layout-top2 .top2 {
	width: 1070px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	height: 54px;
}

.layout-top2 .logo {
	background: #FFF;
	float: left;
	overflow: hidden;
	padding: 9px 0;
	height: 36px;
}

.layout-top2 .logo img {
	height: 36px;
}

.layout-top2 .logo a {
	display: inline-block;
	line-height: 44px;
	height: 36px;
}

.layout-top2 .logo .logo_right {
	margin-left: 5px;
}

.layout-top2 .menu {
	margin-left: 370px;
	line-height: 53px;
	height: 53px;
}

.layout-top2 .menu ul {
	margin: 0;
	padding: 0;
	overflow: hidden;
	white-space: nowrap;
	height: 100%;
}

.layout-top2 .menu ul a {
	color: #5F9FC3;
	width: 100%;
	display: inline-block;
}

.layout-top2 .menu ul span {
	color: #5F9FC3;
	width: 100%;
	display: inline-block;
	height: 100%;
}

.layout-top2 .menu li {
	float: right;
	list-style: none;
	width: 100px;
	height: 100%;
	background: #FFF;
	color: #373737;
	font-size: 15px;
	cursor: pointer;
	text-align: center;
}

.layout-top2 .menu li.menu-separator {
	width: 2px;
}

.layout-top2 .menu li.menu-separator span {
	font-size: 13px;
	color: #BCD3E5;
}

.layout-top2 .menu li:hover {
	font-weight: bold;
}

.layout-top2 .menu li.on {
	font-weight: bold;
}

.layout-top2 .sub-menu {
	position: absolute;
	top: 42px;
	z-index: 2;
	margin-top: 3px;
	width: 100px;
	display: none;
	background: #FFF;
}

.layout-top2 .sub-menu .pointer {
	padding-top: 5px;
	background: url("../images/default/ico-point.png") top center no-repeat;
	border-bottom: 3px #31AEFC solid;
}

.layout-top2 .sub-menu ul {
	margin: 0;
	/*padding: 0;*/
	list-style: none;
	border: 1px #095585 solid;
	border-top: 3px #095585 solid;
	background: #F5F5F5;
	padding: 6px 10px;
}

.layout-top2 .sub-menu li {
	font-size: 14px;
	padding: 4px 0;
}

.layout-top2 .sub-menu a {
	color: #31AEFC;
	background: #F5F5F5;
}

.layout-top2 .sub-menu a:hover {
	text-decoration: underline
}

.layout-banner {
	background: #FFFFFF;
	height: 67px;
	overflow: hidden;
}

.layout-banner .slide-area {
	width: 1000px;
	margin: 0 auto;
}

.layout-footer {
	background: #FFFFFF;
}

.layout-footer .footer {
	width: 1000px;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}

/* 폰트 */
.font-bold {
	font-weight: bold;
}

.fs13 {
	font-size: 1.3em;
}

.fs11 {
	font-size: 1.1em;
}

.fs10 {
	font-size: 1em;
}

.fs09 {
	font-size: 0.9em;
}

.mt15 {
	margin-top: 15px;
}

.mt10 {
	margin-top: 10px;
}

.mt5 {
	margin-top: 5px;
}

.mb10 {
	margin-bottom: 10px;
}

.mb5 {
	margin-bottom: 5px;
}

.layout-main {
	background: #FFF;
	padding: 0;
	min-height: 660px;
	clear: both;
}

.layout-main .cpkr .content {
	margin-top: 40px;
	padding-bottom: 40px;
}

.layout-main .cpkr .content .content {
	padding-bottom: 0;
}

.cpkr {
	margin: 0 auto;
	width: 1000px;
	background: #FFF;
}

.cpkr .left-side {
	width: 480px;
	float: left;
	text-align: left;
}

.cpkr .left-side img {
	margin-left: 20px;
}

.cpkr .right-side {
	width: 500px;
	float: right;
}

.cpkr .header .menu1 {
	color: #474948;
	font-weight: bold;
	text-align: right;
	font-size: 11px;
	font-family: inherit;
	height: 65px;
}

.cpkr .header .menu1 a {
	color: #474948;
	text-decoration: none;
	font-weight: bold;
}

.cpkr .header .menu1 .link {
	cursor: pointer;
	color: #474948;
	font-family: inherit;
	text-decoration: none;
	font-weight: bold;
}

#small_logo {
	margin: 0;
	padding: 0;
	position: absolute;
	left: 794px;
	top: 8px;
	z-index: 5;
	width: 186px;
	height: 40px;
}

/* common/ckchina/tpl/popup/_popup.skin.css 에서 관리 */
/*.pop-bg {*/
/*	display: none;*/
/*	position: fixed;*/
/*	left: 0;*/
/*	top: 0;*/
/*	right: 0;*/
/*	bottom: 0;*/
/*	z-index: 50;*/
/*	background: black;*/
/*	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";*/
/*	filter: alpha(opacity = 50);*/
/*	-moz-opacity: 0.5;*/
/*	-khtml-opacity: 0.5;*/
/*	opacity: 0.5;*/
/*	zoom: 1*/
/*}*/

/*.pop-info {*/
/*	position: absolute;*/
/*	z-index: 100;*/
/*}*/

/*.pop-info .outter {*/
/*	margin: 0 auto;*/
/*	width: 406px;*/
/*	position: fixed;*/
/*	z-index: 100;*/
/*	left: 50%;*/
/*	margin-left: -203px;*/
/*	top: 200px;*/
/*	height: auto;*/
/*	display: none;*/
/*	zoom: 1*/
/*}*/

/*.pop-info .top {*/
/*	background: url("../images/default/popup_small_bg_top2.png") left top no-repeat;*/
/*	height: 32px;*/
/*	text-align: right;*/
/*}*/

/*.pop-info .middle {*/
/*	background: url("../images/default/popup_small_bg_middle.png") left center repeat-y;*/
/*}*/

/*.pop-info .bottom {*/
/*	height: 31px;*/
/*	background: url("../images/default/popup_small_bg_bottom.png") left bottom no-repeat;*/
/*	margin: 0;*/
/*}*/

/*.pop-info .symbol {*/
/*	background: url("../images/default/img-info.png") center center no-repeat;*/
/*	height: 120px*/
/*}*/

/*.pop-info .big-msg {*/
/*	color: #56ACE9;*/
/*	font-size: 22px;*/
/*	text-align: center;*/
/*	width: 366px;*/
/*	margin: 0 auto;*/
/*	margin-top: 10px;*/
/*}*/

/*.pop-info .small-msg {*/
/*	color: #888888;*/
/*	font-size: 16px;*/
/*	text-align: center;*/
/*	width: 366px;*/
/*	margin: 0 auto;*/
/*}*/

/*.pop-wait {*/
/*	position: absolute;*/
/*	z-index: 100;*/
/*}*/

/*.pop-wait .outter {*/
/*	margin: 0 auto;*/
/*	width: 406px;*/
/*	position: fixed;*/
/*	z-index: 100;*/
/*	left: 50%;*/
/*	margin-left: -203px;*/
/*	top: 200px;*/
/*	height: auto;*/
/*	display: none;*/
/*	zoom: 1*/
/*}*/

/*.pop-wait .top {*/
/*	background: url("../images/default/popup_small_bg_top.png") left top no-repeat;*/
/*	height: 32px;*/
/*}*/

/*.pop-wait .middle {*/
/*	background: url("../images/default/popup_small_bg_middle.png") left center repeat-y;*/
/*}*/

/*.pop-wait .bottom {*/
/*	height: 31px;*/
/*	background: url("../images/default/popup_small_bg_bottom.png") left bottom no-repeat;*/
/*}*/

/*.pop-wait .symbol {*/
/*	background: url("../images/default/clock.gif") center center no-repeat;*/
/*	height: 100px;*/
/*}*/

/*.pop-wait .big-msg {*/
/*	color: #56ACE9;*/
/*	font-size: 22px;*/
/*	text-align: center;*/
/*	width: 366px;*/
/*	margin: 0 auto;*/
/*	margin-top: 10px;*/
/*}*/

/*.pop-wait .small-msg {*/
/*	color: #888888;*/
/*	font-size: 16px;*/
/*	text-align: center;*/
/*	width: 366px;*/
/*	margin: 0 auto;*/
/*	margin-top: 14px;*/
/*}*/

.pointer {
	cursor: pointer;
}

.rep {
	position: relative;
}

/* float clearing for IE7 */
*+html .clearfix {
	min-height: 1%;
}

/* float clearing for everyone else */
.clearfix:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
	font-size: 0;
}

#copy_result {
	background: #FFFFFF;
	position: absolute;
	z-index: 60;
	display: none;
	padding: 10px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	width: 1070px;
	left: 50%;
	margin-left: -535px;
}

#copy_result a {
	text-decoration: underline;
}

#copy_result a:hover {
	color: blue;
}

.channel_desc {
	border: 2px #E0E0E0 solid;
	padding: 20px;
	margin-top: 50px;
	color: #999;
}

.channel_desc h2 {
	margin-bottom: 14px;
	font-size: 20px;
}

.channel_desc ul {
	margin: 0;
	padding: 0;
	margin-left: 10px;
}

.channel_desc li {
	line-height: 180%;
	list-style-type: circle;
}

.ck-btn01 {
	background-color: #6BC1EF;
	border: 1px #4DA9E2 solid;
	border-radius: 3px;
	height: 23px;
	padding: 0 6px;
	font-weight: bold;
	cursor: pointer;
	color: #FFF;
	display: inline-block;
	vertical-align: middle;
}

.ck-btn01:hover {
	background-color: #5DB4EB;
}

.ck-btn01-off {
	background-color: #CCC;
	border: 1px #9E9E9E solid;
	border-radius: 3px;
	height: 23px;
	padding: 0 6px;
	font-weight: bold;
	color: #FFF;
	display: inline-block;
	vertical-align: middle;
}

.ck-btn02-blue {
	background-color: #5DB8E9;
	border: none;
	border-radius: 4px;
	line-height: 28px;
	font-size: 12px;
	margin: 0 3px 6px 0;
	padding: 0 8px;
	font-weight: bold;
	cursor: pointer;
	color: #FFF;
	box-shadow: 2px 3px 3px #B0B0B0;
	display: inline-block;
	vertical-align: middle;
}

span.ck-btn02-blue {
	line-height: 28px;
	padding: 0 12px;
	text-align: center;
}

.ck-btn02-blue:hover {
	background-color: #3FA1DE;
}

.ck-btn02-grey {
	cursor: pointer !important;
	background-color: #9E9E9E;
	border: none;
	border-radius: 4px;
	height: 28px;
	font-size: 12px;
	margin: 0 3px 6px 0;
	padding: 0 8px;
	font-weight: bold;
	/*cursor: default;*/
	color: #FFF;
	box-shadow: 2px 3px 3px #B0B0B0;
	display: inline-block;
	vertical-align: middle;
}

span.ck-btn02-grey {
	line-height: 28px;
	padding: 0 12px;
	text-align: center;
}

.ck-btn03 {
	background-color: #4FA5E5;
	border: 1px #298DD8 solid;
	height: 24px;
	padding: 0 6px;
	color: #FFF;
	cursor: pointer;
	display: inline-block;
	vertical-align: middle;
}

.ck-btn03:hover {
	text-decoration: underline;
}

#drop_down ul {
	display: none;
	position: absolute;
	background-color: white;;
	z-index: 999;
	top: 53px;
	width: 200px;
	height: 70px;
}

#drop_down ul li {
	height: 35px;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	text-align: left;
	width: 200px;
	line-height: 35px;
	background-color: #f7f7f7;
	border: none;
}

#drop_down ul li:last-child {
	box-sizing: border-box;
	border-bottom: 1px #999 solid;
}

#drop_down ul li a {
	height: 35px;
	margin: 0;
	width: 170px;
	padding: 0 15px;
}

#drop_down ul li a:hover {
	color: #000;
	text-decoration: underline;
}

#drop_down:hover ul {
	display: block;
}

#drop_down ul li .on {
	color: #00aaee;
	text-decoration: underline;
}

/*.header-title {*/
/*	height: 45px;*/
/*	font-size: 45px;*/
/*	border-left: #01aaef 4px solid;*/
/*	line-height: 1;*/
/*	padding-left: 30px;*/
/*	font-family: 'Noto Sans SC', 'Microsoft YaHei', Pretendard, sans-serif;*/
/*	display: inline-block;*/
/*	text-align: left;*/
/*	margin-bottom: 45px;*/
/*	margin-top: 0;*/
/*}*/

.header-banner {
	font-size: 24px;
	line-height: 1;
	font-family: 'Noto Sans SC', 'Microsoft YaHei', Pretendard, sans-serif;
	display: inline-block;
	text-align: left;
}

.loading-img {
	width: 60px;
	height: 60px;
	animation: rotate 0.8s infinite linear;
	border-right-color: transparent;
	background-image: url("/common/img/loading.png");
	margin: 0 auto;
}

@keyframes rotate {
	0%    { transform: rotate(0deg); }
	100%  { transform: rotate(360deg); }
}

.mb40 {
	margin-bottom: 40px !important
}

.mb50 {
	margin-bottom: 50px !important
}

.mb60 {
	margin-bottom: 60px !important
}

.margin0 {
	margin: 0 !important;
}

/* Main Page - 2023.03 */
body {
	--header-util-height: 50px;
	--header-nav-height: 80px;
	--footer-height: 303px;
	--header-height: calc(var(--header-util-height)+ var(--header-nav-height));
	--color-default: #120537;  /* china color --china-main */
	--color-primary: #17AAEC; /* china color --china-b */
	--color-primary-100: #F6FBFF;
	--color-primary-200: #0FABFF;
	--color-secondary: var(--color-gray-20); /* china color --china-b-20 */
	--color-third: #FF7D1A;
	--color-gray: #F0F1F2; /* china color --china-gray-10 */
	--color-gray-50: #A09DAA; /* china color --china-gray-50 */
	--color-gray-20: #D6D9E1; /* china color --china-b-20 */
	--color-black: #021821; /* china color --china-black */
	--color-error: #FF0000;  /* china color --china-red */
	--color-beige: #FEEFE0; /* china color --china-beige */
	--color-rgb-gray: 240, 241, 242; /* china color --china-gray-10 */
	--color-rgb-white: 255, 255, 255;
	--color-rgb-black: 0, 0, 0;
	--color-rgb-header: 238, 249, 255;
	--color-rgb-header-1: 15, 171, 255;
	--color-hover: #1A172F;
	--color-form-focus: #1A172F;
	--header-bg-opacity: 1;
	/*--header-bg-def: rgba(var(--color-rgb-white), var(--header-bg-opacity));*/
	--header-bg-def: rgba(var(--color-rgb-gray), var(--header-bg-opacity));
	--header-bg-color: rgba(var(--color-rgb-header), var(--header-bg-opacity));
	--header-bg-primary: rgba(var(--color-rgb-header-1), var(--header-bg-opacity));
	--kv-bg: #EEF9FF;
	--kv-bg-primary: rgb(var(--color-rgb-header-1));
	--bg-gradient: linear-gradient(92.34deg, #55B0E7 -0.59%, #00E9C6 100.14%);
	--gap-def: 15px;
	--width: 1000px;
	--min-container-width: calc(var(--width) + var(--gap-def)* 2);
	--move-more-arr: translateX(3px);
	--form-control-field-height: 32px;
	--form-control-field-height-lg: 44px;
	--placeholder: var(--color-gray-50);
	--color-input-base-line: #E1E2E3;
	--color-line: var(--color-gray-20); /* china color --china-b-20 */
	--font-default: 'Noto Sans SC';
	--font-light: 300;
	--font-regular: 400;
	--font-bold: 700;
	--font-black: 900;
	--input-field-fontsize: 18px;
	min-width: var(--min-container-width);
	min-height: 100vh;
	margin: 0;
	padding: 0;
	color: var(--color-default);
}

body, table, input, textarea, select, button {
	font-family: var(--font-default), 'Microsoft YaHei', Pretendard, Arial, Tahoma, Geneva, sans-serif;
}

#ref-skin-path, #ref-layout-path {
	display: none;
}

body *, .cpkr * {
	font-family: var(--font-default), 'Microsoft YaHei', Pretendard, Arial, Tahoma, Geneva, sans-serif;
}

h1, h2, h3, h4, h5, h6, .mhuTitle-root b, .mhuTitle-root strong {
	font-weight: normal;
	margin: 0;
}

.mhuTitle-root, .mhuText--b, .mhuText--strong, .mhuTitle--h1, .mhuTitle--h2, .mhuTitle--h3, .mhuTitle--h4 {
	font-family: var(--font-black), 'Noto Sans', Pretendard;
}

.boardReadBody *, .extraVarsList * {
	font-family: var(--font-default), 'Microsoft YaHei', Pretendard !important;
}

/*[class^="mhu"] input[type="text"], [class^="mhu"] input[type="password"], [class^="mhu"] select{
	height: initial;
	line-height: initial;
	background: initial;
	border: initial;
	color: initial;
}*/

/************************************************************************
* ckchina / ej / 2023.07
************************************************************************/
/* layout 공통 */
.ckchina.mhuLayout-root {
	min-height: calc(100vh - (var(--header-util-height) + var(--header-nav-height) + var(--footer-height)));
	overflow: hidden;
}
.ckchina.mhuLayout-root .mhuLayout-sub {
	width: var(--min-container-width);
	margin: 0 auto;
	padding: 0 var(--gap-def);
}
.ckchina.mhuLayout-root .mhuLayout-sub > .mhuLayout-sub__inner {
	padding-top: 110px;
	padding-bottom: 124px;
}
.ckchina.mhuLayout-root .mhuLayout-sub > .mhuLayout-sub__inner .mhuLayout-sub__inner-footer {
	display: flex;
	justify-content: flex-end;
}
.ckchina.mhuLayout-root .mhuLayout-sub > .mhuLayout-sub__inner .mhuLayout-sub__inner-footer.mhuStyle-center {
	justify-content: center
}
.ckchina.mhuLayout-root .mhuLayout-sub .header-title {
	height: auto;
	margin-bottom: 20px;
	font-size: 36px;
	font-weight: var(--font-black);
	line-height: 1.6;
	color: var(--color-default);
}
/* layout 로그인, 회원가입 공통 */
.ckchina .mhuLayout-bg-gray {
	position: relative;
	left: 50%;
	width: 100vw;
	min-width: var(--min-container-width);
	transform: translateX(-50%);
	background-color: var(--color-gray);
	margin-top: -110px;
	margin-bottom: -124px;
	padding-top: 130px;
	padding-bottom: 248px;
	text-align: center;
}
.ckchina .mhuLayout-bg-gray .mhuItem-login {
	margin: 0 auto;
}
/* 로그인 공통 */
.ckchina .mhuItem-login {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 500px; /*465px;*/
	min-height: 640px;
	padding: 42px 40px 50px;
	border-radius: 20px;
	background: #fff;
}
.ckchina .mhuItem-login__cont {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	text-align: center;
	flex: 1;
}
.ckchina .mhuItem-login__title-area {
	padding-top: 63px;
}
.ckchina .mhuItem-login__title {
	color: var(--color-default);
	text-align: center;
	font-size: 36px;
	font-weight: var(--font-black);
	line-height: 1.6
}
.ckchina .mhuItem-login__text {
	color: var(--color-default);
	font-size: 18px;
	font-weight: var(--font-regular);
	line-height: 1.2;
}
.ckchina .mhuItem-login__body-area {
	width: 100%;
	padding-top: 32px;
}
.ckchina .mhuItem-login__bottom-area {
	margin-top: auto;
}
.ckchina .mhuItem-login__bottom-area .mhuLink-root {
	display: inline-flex;
	transition: all 0.15s ease;
	cursor: pointer;
	vertical-align: middle;
	font-size: 24px;
	font-weight: var(--font-black);
	line-height: 1.8;
	color: var(--color-gray-50);
}
.ckchina .mhuItem-login__bottom-area .mhuLink--arrow .mhuLink__text--more:after {
	content: '';
	display: inline-block;
	position: relative;
	height: 100%;
	transition: transform 0.15s ease-in;
	transform: translateX(0);
}
.ckchina .mhuItem-login__bottom-area .mhuLink--arrow:hover .mhuLink__text--more:after {
	transform: translateX(4px);
}
.ckchina .mhuItem-login__bottom-area .mhuLink--arrow .mhuLink__text--more:after {
	top: -3px;
	width: 28px;
	height: 28px;
	background: url('/layouts/ckchina_www/images/icon/icon_arrow_forward@gray.png') no-repeat center center/contain;
	content: '';
	vertical-align: middle;
}
.ckchina .mhuItem-login__bottom-area .mhuLink--logout .mhuLink__text--more:before {
	content: '';
	display: inline-block;
	position: relative;
	height: 100%;
	transition: transform 0.15s ease-in;
	transform: translateX(-4px);
}
.ckchina .mhuItem-login__bottom-area .mhuLink--logout:hover .mhuLink__text--more:before {
	transform: translateX(0px);
}
.ckchina .mhuItem-login__bottom-area .mhuLink--logout .mhuLink__text--more:before {
	top: 1px;
	width: 28px;
	height: 28px;
	background: url('/layouts/ckchina_www/images/icon/icon_arrow_logout@gray.png') no-repeat center center/contain;
	content: '';
	vertical-align: middle;
}
.ckchina .mhuItem-login .mhuButtonBox-root{
	flex-direction: column;
	margin-top: 20px;
	margin-left: 0;
	margin-right: 0;
}
.ckchina .mhuItem-login .mhuButtonBox-root .mhuButton-root{
	--btn-height: 54px;
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
	min-width: auto;
	font-size: 24px;
}

/* qr 로그인 */
.ckchina .mhuItem-login__qr .mhuItem-login__title-area {
	background: url("/layouts/ckchina_www/images/ckchina_wechat_logo.png") no-repeat top center / 66px auto ;
}
.ckchina .mhuItem-login__body-area .mhuItem-qr {
	margin: 10px auto 0;
	width: 260px;
	height: 260px;
}
.ckchina .mhuItem-login__body-area .mhuItem-qr .mhuItem-qr__img img{
	display: block;
	width: 100%;
}

/* input 로그인 */
.ckchina .mhuItem-login__def {
	padding-top: 20px;
}
.ckchina .mhuItem-login__fields{
	width: 100%;
	padding:0;
	margin: 0;
}
.ckchina .mhuItem-login__fields .mhuFormControlField-root {
	position: relative;
	margin-bottom: 12px;
	text-align: left;
}
.ckchina .mhuItem-login__fields .mhuFormControlLabelBox-root {
	display: flex;
	padding-bottom: 12px;
}
.ckchina .mhuItem-login__fields .mhuFormControlLabelBox-root .mhuFormControlLabel-text {
	flex-shrink: 0;
}
.ckchina .mhuItem-login__fields .mhuFormControlLabel-text {
	margin-right: 4px;
	font-size: 18px;
	line-height: 1;
	font-weight: var(--font-black);
	color: #000;
}
.ckchina .mhuItem-login__fields .mhuFormControlLabel-icon{
	position: absolute;
	height: 100%;
	padding: 0 12px 0 20px;
}
.ckchina .mhuItem-login__fields .mhuFormControlLabel-icon:before{
	display: block;
	height: inherit;
	background: no-repeat center center / contain;
	opacity: 0.8;
	content:'';
}
.ckchina .mhuItem-login__fields .mhuFormControlLabel-id:before{
	width: 20px;
	background-image: url('/layouts/ckchina_www/images/icon/icon_phone_android@gray.png');
}
.ckchina .mhuItem-login__fields .mhuFormControlLabel-pw:before{
	width: 20px;
	background-image: url('/layouts/ckchina_www/images/icon/icon_vpn_key@gray.png');
}
.ckchina .mhuItem-login__fields .mhuFormControlLabel-icon span{
	display: inline-block;
	width: 1px;
	height: 1px;
	font-size: 0;
	text-indent: -9999px;
	line-height: 1;
}

.ckchina .mhuItem-login__fields .mhuFormControlFieldBox-root {
	display: flex;
	gap: 12px;
}
.ckchina .mhuItem-login__fields .mhuFormControlFieldBox-root .mhuButton-root {
	--btn-height: var(--form-control-field-height-lg);
	white-space: nowrap;
}
.ckchina .mhuItem-login__fields .mhuFormControlField.mhuFormControlField-icon[type="text"],
.ckchina .mhuItem-login__fields .mhuFormControlField.mhuFormControlField-icon[type="password"],
.ckchina .mhuItem-login__fields .mhuFormControlField.mhuFormControlField-icon[type="file"],
.ckchina .mhuItem-login__fields .mhuFormControlField.mhuFormControlField-icon[type="number"] {
	padding: 9px 20px 11px 52px;
}
.ckchina .mhuItem-login__fields .mhuFormControlField[type="text"],
.ckchina .mhuItem-login__fields .mhuFormControlField[type="password"],
.ckchina .mhuItem-login__fields .mhuFormControlField[type="file"],
.ckchina .mhuItem-login__fields .mhuFormControlField[type="number"] {
	padding: 9px 20px 11px;
	width: 100%;
	height: var(--form-control-field-height-lg);
	background: var(--color-gray);
	border-radius: var(--border-radius-1);
	font-size: var(--input-field-fontsize);
	color: var(--color-default);
	border: 2px solid var(--color-gray);
}
.ckchina .mhuItem-login__fields .mhuFormControlField[type="text"]:read-only,
.ckchina .mhuItem-login__fields .mhuFormControlField[type="password"]:read-only,
.ckchina .mhuItem-login__fields .mhuFormControlField[type="file"]:read-only,
.ckchina .mhuItem-login__fields .mhuFormControlField[type="number"]:read-only {
	/*border: 1px solid var(--color-primary);*/
	background: #ffffff;
}

.ckchina .mhuItem-login__fields .mhuFormControlField:placeholder-shown {
	background-color: var(--color-gray);
	font-weight: var(--font-black);
}

.ckchina .mhuItem-login__fields .mhuFormControlCheck-root {
	display: block;
	position: relative;
	margin: 0 0 12px 0;
	text-align: left;
}
.ckchina .mhuItem-login__fields .mhuFormControlCheck-root .mhuFormControlCheck {
	position: absolute;
	top: 50%;
	left: 16px;
	transform: translateY(-50%);
	width: 28px;
	height: 28px;
	background: url("../images/icon/icon_input_check.png") no-repeat 0 0 / 100%;
	z-index: 1;
	border: none;
}
.ckchina .mhuItem-login__fields .mhuFormControlCheck-root .mhuFormControlCheck:after {
	display: none;
}
.ckchina .mhuItem-login__fields .mhuFormControlCheck-root .mhuFormControlCheck + .mhuFormControlCheckLabel-root {
	display: block;
	margin-left: 0;
	padding: 11px 16px 11px 56px;
	border-radius: var(--border-radius-3);
	border: 2px solid var(--color-gray-20);
	color: var(--color-gray-50);
	font-size: 14px;
	font-weight: var(--font-regular);
	line-height: 1.6;
	cursor: pointer;
}
.ckchina .mhuItem-login__fields .mhuFormControlCheck-root .mhuFormControlCheck + .mhuFormControlCheckLabel-root a {
	text-decoration: underline;
}
.ckchina .mhuItem-login__fields .mhuFormControlCheck-root .mhuFormControlCheck:checked {
	background: url("../images/icon/icon_input_check@white.png") no-repeat 0 0 / 100%;
}
.ckchina .mhuItem-login__fields .mhuFormControlCheck-root .mhuFormControlCheck:checked + .mhuFormControlCheckLabel-root {
	background-color: var(--color-primary);
	color: #fff;
	border-color: var(--color-primary);
}

.ckchina .mhuItem-login__fields .mhuItem-validation-text {
	display: inline-flex;
	color: var(--color-error);
	font-size: 14px;
	line-height: 20px;
	text-align: left;
}
.ckchina .mhuItem-login__fields .mhuItem-validation-text.hide {
	display: none;
}
.ckchina .mhuItem-login__fields .mhuItem-validation-text:not(:empty):before {
	content: "";
	display: inline-flex;
	margin-right: 2px;
	width: 20px;
	height: 20px;
	background: url("../images/icon/icon_input_validation.png") no-repeat center / 16px auto;
}
.ckchina .mhuItem-login__fields .mhuItem-notice-text {
	display: inline-flex;
	margin-top: 12px;
	color: var(--color-default);
	font-size: 14px;
	line-height: 20px;
	text-align: left;
}
.ckchina .mhuItem-login__fields .mhuItem-notice-text:not(:empty):before {
	content: "";
	display: inline-flex;
	margin-right: 2px;
	width: 20px;
	height: 20px;
	background: url("../images/icon/icon_input_notice.png") no-repeat center / 16px auto;
}
.ckchina .mhuItem-login__fields .mhuItem-countdown-text {
	display: inline-flex;
	color: var(--color-primary);
	font-size: 14px;
	line-height: 20px;
	text-align: left;
}
.ckchina .mhuItem-login__fields .mhuItem-countdown-text.mhuStyle-red {
	color: var(--color-error);
}
.ckchina .mhuItem-login .mhuItem-login__util {
	display: flex;
	justify-content: center;
	align-items: center;
	padding-left: 0;
	margin-top: 24px;
	margin-bottom: 0;
}
.ckchina .mhuItem-login .mhuItem-login__util-item {
	list-style: none;
	position: relative;
	width: auto;
	margin-right: 13px;
	padding-right: 13px;
}
.ckchina .mhuItem-login .mhuItem-login__util-item:last-child {
	margin-right:0;
	padding-right: 0;
}
.ckchina .mhuItem-login .mhuItem-login__util-item:last-child:after {
	display: none;
}
.ckchina .mhuItem-login .mhuItem-login__util-item:after {
	position: absolute;
	right:0;
	top: 2px;
	height:16px;
	border-left: 2px solid var(--color-default);
	content:'';
}
.ckchina .mhuItem-login .mhuItem-login__util-link {
	font-size: 18px;
	font-weight: var(--font-bold);
	line-height: 18px;
	color: var(--color-default);
	transition: all 0.15s ease;
}
.ckchina .mhuItem-login .mhuItem-login__util-link:hover {
	color: var(--color-primary);
}

/* 회원가입(로그인 base) */
.ckchina .mhuItem-signup {
	padding-bottom: 56px;
}
.ckchina .mhuItem-signup .mhuItem-login__input .mhuItem-login__body-area {
	padding-top: 52px;
}
.ckchina .mhuItem-signup .mhuItem-login__qr {
	padding-top: 100px;
	padding-bottom: 47px;
}
.ckchina .mhuItem-signup .mhuItem-login__fields .mhuFormControlField-root {
	margin-bottom: 24px;
}

/* modal */
.mhuModal-ckchina {
	--modal-padding-x: 52px;
	--modal-padding-top: 44px;
	--modal-padding-bottom: 32px;

}
.mhuModal-ckchina .mhuModal__content {
	--modal-radius: 20px;
	--modal-box-shadow: none;
	border: 1px solid var(--color-line);
}
.mhuModal-ckchina .mhuModalHeader-root {
	padding: var(--modal-padding-top) var(--modal-padding-x) 0;
}
.mhuModal-ckchina .mhuModalHeader__btn-close {
	--modal-padding: 20px;
	--modal-close-width: 40px;
	background: url("../images/icon/icon_modal_close.png") no-repeat 0 0 / 100%;
}
.mhuModal-ckchina .mhuModalBody-root {
	padding: var(--modal-padding-bottom) var(--modal-padding-x);
}
/* input */
.mhuFormControlField-root .mhuFormControlField[type="text"].mhuState-validation,
.mhuFormControlField-root .mhuFormControlField[type="password"].mhuState-validation,
.mhuFormControlField-root .mhuFormControlField[type="file"].mhuState-validation,
.mhuFormControlField-root .mhuFormControlField[type="number"].mhuState-validation{
	border: 2px solid var(--color-error);
	color: var(--color-error);
}
/* checkbox */
.ckchina .mhuFormControlCheck {
	border: 1px solid var(--color-line);
}
.ckchina .mhuFormControlCheck:checked {
	background-color: var(--color-primary);
	border-color: var(--color-primary);
}
.ckchina .mhuFormControlCheck[type="checkbox"] {
	width: 20px;
	height: 20px;
	border-radius: 4px;
}
.ckchina .mhuFormControlCheck[type="checkbox"]:after {
	background-image: url('../images/icon/icon_input_check@white.png');
}

/* Button */
.mhuButton-root, .ckchina .mhuButton-root {
	--btn-height: 32px;
	min-width: auto;
	padding: 0 16px;
	font-size: 14px !important;
	font-weight: var(--font-bold);
}
.mhuButton-root:disabled, .mhuButton-root.mhuButton--primary:disabled, .mhuButton-root.mhuButton--secondary:disabled, .mhuButton-root.mhuButton--dark:disabled{
	background-color: var(--color-gray-50);
	color: #fff;
	cursor: default;
}
.mhuButton-root.mhuButton--primary-outline:disabled {
	border: 0;
	background-color: var(--color-gray-50);
	color: #fff;
	cursor: default;
}
.ckchina .mhuButtonBox-root {
	margin-right: -4px;
}
.mhuButtonBox-root.mhuStyle-center, .ckchina .mhuButtonBox-root.mhuStyle-center {
	justify-content: center;
}
.ckchina .mhuButtonBox-root .mhuButton-root {
	margin: 0 4px;
}
.mhuButton-root[class*="-outline"] {
	line-height: var(--btn-height) !important;
}

/* button size */
.mhuButton-root.mhuButton--size-md {
	--btn-height: 40px;
	min-width: auto;
	padding: 0 28px;
	font-size: 18px !important;
	font-weight: var(--font-black);
	border-radius: var(--border-radius-3) !important;
}
.mhuButton-root.mhuButton--size-lg {
	--btn-height: 50px;
	min-width: auto;
	padding: 0 32px;
	font-size: 24px !important;
	font-weight: var(--font-black);
	border-radius: var(--border-radius-3) !important;
}

.mhuButton-root .mhuButton__text--more {
	height: 100%;
}
.mhuButton-root .mhuButton__text--more:after {
	top: 1px;
	flex-shrink: 0;
	width: 20px;
	margin-left: 10px;
	margin-right: -10px;
	background: url('../images/icon/icon_arrow_forward.png') no-repeat center center/contain;
	content: '';
	/*vertical-align: middle;*/
	vertical-align: bottom;
}
.mhuButton-root.mhuButton--size-lg .mhuButton__text--more:after {
	top: 1px;
	flex-shrink: 0;
	width: 28px;
	margin-left: 12px;
	margin-right: -12px;
	background: url('../images/icon/icon_arrow_forward.png') no-repeat center center/contain;
	content: '';
	/*vertical-align: middle;*/
	vertical-align: bottom;
}
/* icon + text button */
.mhuButton-root.mhuButton--primary-download, .mhuButton-root.mhuButton--primary-lock {
	padding-left: 10px;
}
.mhuButton-root.mhuButton--primary-download:before, .mhuButton-root.mhuButton--primary-lock:before {
	content: "";
	display: inline-flex;
	vertical-align: middle;
	margin-right: 5px;

}
.mhuButton-root.mhuButton--primary-download:before {
	width: 20px;
	height: 20px;
	background: url('../images/icon/icon_download_for_offline@white.png') no-repeat left bottom / 20px 20px;
}
.mhuButton-root.mhuButton--primary-lock:before {
	width: 20px;
	height: 20px;
	background: url('../images/icon/icon_lock@white.png') no-repeat left bottom / 20px 20px;
}

/* icon 만 있는 버튼 */
.mhuButton-root.mhuButton--icon {
	width: 24px;
	height: 24px;
	padding: 0;
}
.mhuButton-root.mhuButton--icon.mhuButton--icon-delete {
	background: url('../images/icon/icon_delete.png') no-repeat 0 0 / 24px 24px;
}

/* 텍스트 + 화살표 button */
.mhuButton--primary .mhuButton__text--more:after, .mhuButton--primary-outline:hover .mhuButton__text--more:after, .mhuButton--dark .mhuButton__text--more:after {
	background-image: url('../images/icon/icon_arrow_forward@white.png') !important;
}

/* 색상별 button */
.mhuButton-root.mhuButton--main {
	background: var(--color-gray);
	color: var(--color-black);
}
.mhuButton-root.mhuButton--dark {
	background: var(--color-default);
	color: #fff;
}
.mhuButton-root.mhuButton--disabled {
	background-color: var(--color-gray-50);
	color: #fff;
	cursor: default;
}


.ckchina .boardList {
	font-size: 16px;
	font-family: var(--font-default);
}
.ckchina .boardList th {
	vertical-align: middle;
	line-height: 24px;
	font-size: 16px;
	font-weight: bold;
	color: var(--color-default);
	padding: 10px 5px 12px;
	background: #f9f9fb;
}
.ckchina .boardList tbody tr:hover {
	background-color: #DEF3FF;
}
.ckchina .boardList tbody tr:hover td, .ckchina .boardList tbody tr:hover td.title a {
	background-color: #DEF3FF;
	color: #4DA9E2;
}
.ckchina .boardList tbody tr:hover td.no_document {
	background-color: #FFFFFF;
	color: #120537;
}
.ckchina .boardList th div.checker input {
	position: absolute;
	top: 0;
	left: 0;
}
.ckchina .boardList th a {
	font-size: inherit;
	color: inherit;
}
.ckchina .boardList td {
	padding: 10px 5px;
	/* line-height: 43px; */
	height: 64px;
	font-size: 15px;
}
.ckchina .boardList td.title a {
	color: #000;
}
.ckchina .boardList td.title.title_notice a {
	color: var(--color-primary);
}

.ckchina .boardList .notice td {
	line-height: 24px;
}
.ckchina .boardList .notice td .notice {
	white-space: nowrap;
}
.ckchina .boardList td.notice {
	font-weight:var(--font-black);
}
.ckchina .boardList td.num {
	font-size: 15px;
}
.ckchina .boardList td.check { font-size: 15px; }
.ckchina .boardList td.title {
	white-space: normal;
	text-align: left;
	font-size: 15px;
	word-break: break-all;
}
.ckchina .boardList td.replies { font-size: 15px; }
.ckchina .boardList td.reading{ font-size: 15px; }
.ckchina .boardList td.recommend{ font-size: 15px; font-weight:var(--font-black); }
.ckchina .boardList td.date{ font-size: 15px; }
.ckchina .boardList td.category { font-size: 15px; }
.ckchina .boardList td.replyAnchor { font-size: 15px; }
.ckchina .boardList td.by { font-size: 15px;}
.ckchina .boardList span.notice {
	padding: 1px 5px;
	font-size: 15px;
}

.ckchina .board .mhuItem-board__footer {
	display: flex;
	justify-content: flex-end;
}
.ckchina .board .mhuItem-board__footer .mhuButtonBox-root {
	align-items: center;
}
.ckchina .board .mhuButton--primary, .ckchina .board .mhuButton--dark {
	color: #fff;
}
.ckchina .board .mhuButton--primary:hover, .ckchina .board .mhuButton--dark:hover {
	color: #fff;
}
.ckchina .board .mhuButton--primary-outline {
	color: var(--color-primary);
}
.ckchina .board .mhuButton--primary-outline:hover {
	color: #fff;
}

/* pagination */
.ckchina .pagination, .ckchina .pagination2 {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 25px 0;
	font-size: 14px;
	font-weight: var(--font-bold);
}
.ckchina .pagination > a, .ckchina .pagination2 > a {
	color: var(--color-gray-50);
	padding: 8px 14px;
}
.ckchina .pagination a:hover, .ckchina .pagination2 a:hover {
	color: #000;
	padding: 8px 14px;
}

.ckchina .pagination > strong, .ckchina .pagination2 > strong {
	display: inline-block;
	vertical-align: middle;
	min-width: 36px;
	padding: 8px 4px;
	line-height: 12px;
	color: #fff;
	border-radius: var(--border-radius-2);
	background-color: var(--color-primary);
	text-decoration: none;
}
.ckchina .pagination .prevEnd, .ckchina .pagination .nextEnd, .ckchina .pagination2 .prevEnd, .ckchina .pagination2 .nextEnd,
.ckchina .pagination .prev, .ckchina .pagination .next, .ckchina .pagination2 .prev, .ckchina .pagination2 .next {
	display: inline-block;
	width: 20px;
	height: 20px;
	padding: 0 !important;
}
.ckchina .pagination .prevEnd img, .ckchina .pagination .nextEnd img, .ckchina .pagination2 .prevEnd img, .ckchina .pagination2 .nextEnd img,
.ckchina .pagination .prev img, .ckchina .pagination .next img, .ckchina .pagination2 .prev img, .ckchina .pagination2 .next img{
	display: inline-block;
	width: 100%;
	height: auto;
	vertical-align: text-bottom;
	margin-bottom: 0;
}
.ckchina .pagination .prevEnd, .ckchina .pagination2 .prevEnd,
.ckchina .pagination .prev, .ckchina .pagination2 .prev {
	margin-right: 10px;
}
.ckchina .pagination .nextEnd, .ckchina .pagination2 .nextEnd,
.ckchina .pagination .next, .ckchina .pagination2 .next {
	margin-left: 10px;
}

/* 활용 안내 */
.ckchina.mhuLayout-root .mhuLayout-sub > .mhuLayout-sub__inner .component-wrap {
	margin-bottom: -124px;
}
.ckchina .component {
	padding: 50px 0;
	margin-top: 80px;
	border-radius: 0;
	border: 0;
	background-color: var(--color-gray);
	position: relative;
	left: 50%;
	width: 100vw;
	min-width: var(--min-container-width);
	transform: translateX(-50%);
}
.ckchina .component .component__inner {
	width: var(--min-container-width);
	padding: 0 var(--gap-def);
	margin: 0 auto;
}
.ckchina .component .component--title {
	font-size: 24px;
	font-weight: var(--font-black);
	line-height: 1.8;
	color: #000;
}
.ckchina .component ul {
	margin-top: 0;
	font-size: 18px;
	line-height: 1.8;
	letter-spacing: 0;
	font-weight: var(--font-regular);
	color: #000;
	padding-left: 10px;
}
.ckchina .component ul li {
	list-style: inside;
}

/* 비밀번호 찾기 */
.mhuItem-find-member {
	width: 606px;
	padding: 40px;
	margin: 40px auto 0;
	border: 2px solid var(--color-line);
}
.mhuItem-find-member .mhuItem-find-member__title {
	padding-bottom: 20px;
	font-size: 24px;
	font-weight: var(--font-black);
	color: var(--color-default);
	border-bottom: 2px solid var(--color-line);
}
.mhuItem-find-member .mhuItem-find-member__sub-title {
	padding-top: 15px;
	font-size: 16px;
	line-height: 1.6;
	font-weight: var(--font-regular);
	color: var(--color-default);
}
.mhuItem-find-member .mhuItem-login__fields {
	padding-top: 40px;
}
.mhuItem-find-member .mhuItem-login__fields .mhuFormControlField-root {
	margin-bottom: 25px;
}
.mhuItem-find-member .mhuButtonBox-root {
	padding-top: 40px;
	width: 100%;
	margin: 0;
}
.mhuItem-find-member .mhuButtonBox-root .mhuButton-root {
	flex: 1;
	margin: 0;
}


/* 마이페이지 / 회원정보 */
.mhuItem-member-info {
	width: 606px;
	padding: 40px;
	margin: 40px auto 0;
	border: 2px solid var(--color-line);
}
.mhuItem-member-info .mhuItem-member-info__title {
	padding-bottom: 20px;
	font-size: 24px;
	font-weight: var(--font-black);
	color: var(--color-default);
	border-bottom: 2px solid var(--color-line);
}
.mhuItem-member-info .mhuItem-member-info__sub-title {
	padding-top: 15px;
	font-size: 16px;
	line-height: 1.6;
	font-weight: var(--font-regular);
	color: var(--color-default);
}
.mhuItem-member-info .mhuItem-login__fields {
	padding-top: 40px;
}
.mhuItem-member-info .mhuItem-login__fields .mhuFormControlField-root {
	margin-bottom: 25px;
}
.mhuItem-member-info .mhuButtonBox-root {
	padding-top: 40px;
	width: 100%;
	margin: 0;
}
.mhuItem-member-info .mhuButtonBox-root .mhuButton-root {
	flex: 1;
	margin: 0 4px;
}