@charset "utf-8";

.ckchina .mhuSection-root{
	position: relative;
}
.ckchina .mhuSection-root .mhuSection__inner{
	position: relative;
	height: inherit;
}
.ckchina .mhuSection__inner > .mhuContainer-root {
	width: var(--min-container-width);
	margin: 0 auto;
	padding: 0 var(--gap-def);
}
/************************************************************************
* 메인 section
************************************************************************/
.ckchina .mhuSection--visual {
	width: 100%;
	height: 680px;
	background: #070d1d url("../img/main/bg_main_visual.jpg") no-repeat 50% 50% / cover;
}
.ckchina .mhuSection--visual .mhuSection__inner{
	overflow: hidden;
}
.ckchina .mhuSection--visual .mhuContainer-root:first-child{
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: absolute;
	left: 0;
	top:0;
	right:0;
	bottom:0;
	z-index: 1;
	width: var(--min-container-width);
	height: 100%;
	margin: 0 auto;
	padding: 0 var(--gap-def);
}
.ckchina .mhuSection--visual .mhuItem-text{
	text-align: left;
}
.ckchina .mhuSection--visual .mhuItem-text .mhuButton-root{
	margin-top: 30px;
}
.ckchina .mhuSection--visual .mhuTitle-root{
	font-size: 36px;
	line-height: 1.6;
	text-align: left;
	font-weight: var(--font-black);
	color: var(--color-gray);
}

/************************************************************************
* 로그인 영역
************************************************************************/

/* 로그인 공통 - default.css 에서 관리 */
.ckchina .mhuSection--visual .mhuItem-login {
	width: 380px;
	min-height: 520px;
	padding: 34px 45px 47px;
	border-radius: 40px;
}
.ckchina .mhuSection--visual .mhuItem-login > div {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	text-align: center;
	flex: 1;
}
.ckchina .mhuSection--visual .mhuItem-login > div > div {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	text-align: center;
	flex: 1;
}
.ckchina .mhuSection--visual .mhuItem-login__body-area {
	padding-top: 15px;
}
.ckchina .mhuSection--visual .mhuItem-login__body-area .mhuItem-qr {
	margin: 8px auto 0;
	width: 212px;
	height: 212px;
}
.ckchina .mhuSection--visual .mhuItem-login__title-area {
	padding-top: 14px; /* 48px; */
}
.ckchina .mhuSection--visual .mhuItem-login__qr .mhuItem-login__title-area {
	background: url("/layouts/ckchina_www/images/ckchina_wechat_logo.png") no-repeat top center / 54px auto ;
	padding-top: 63px;
}
/* login_after */
.ckchina .mhuItem-login .mhuItem-pic{
	--profile-img-width: 140px;
	--profile-img-height: var(--profile-img-width);
	width: var(--profile-img-width); height: var(--profile-img-height);
	margin: 0 auto;
	border-radius: 50px;
	overflow: hidden;
	border: 1px solid var(--color-gray);
}
.ckchina .mhuItem-login .mhuItem-pic.mhuItem-pic__wechat {
	background: var(--color-gray) url('../img/main/img_login_pic_wechat_logo.png') no-repeat center center / 85px auto;
}
.ckchina .mhuItem-login .mhuItem-pic.mhuItem-pic__ck {
	background: var(--color-gray) url('../img/main/img_login_pic_ck_logo.png') no-repeat center center / 80px auto;
}
.ckchina .mhuItem-login .mhuItem-pic img {
	width: 100%;
}
.ckchina .mhuItem-login .mhuItem-login-id {
	padding-top: 15px;
	font-size: 18px;
	font-weight: var(--font-black);
	line-height: 1.8;
	color: var(--color-default);
}
.ckchina .mhuItem-login .mhuItem-management {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 12px;
	padding-bottom: 10px;
	gap: 12px;
}
.ckchina .mhuItem-login .mhuItem-management .mhuItem-management__text {
	font-size: 18px;
	color: var(--color-default);
}
.ckchina .mhuItem-login .mhuItem-management .mhuItem-management__point {
	font-size: 24px;
	font-weight: var(--font-black);
	color: var(--color-primary);
}
.ckchina .mhuLayout-bg-gray .mhuCard-root {
	width: 465px;
	margin: 0 auto;
	padding: 42px 40px 50px;
	border-radius: 20px;
	background-color: #fff;
}


/************************************************************************
* section1
************************************************************************/
.ckchina .mhuSection--s1{
	padding-top: 60px;
	padding-bottom: 150px;
	background-color: #fff;
}
.ckchina .mhuSection--s1 .mhuGrid-root{
	justify-content: space-between;
	gap: 20px;
}
.ckchina .mhuSection--s1 .mhuGridItem-root{
	display: flex;
	flex-direction: column;
	flex: 1;
	overflow: hidden;
}
.ckchina .mhuSection--s1 .mhuGridItem__title{
	font-size: 24px;
	font-weight: var(--font-black);
	line-height: 1.8;
	color: var(--color-primary);
}
.ckchina .mhuSection--s1 .mhuGridItem__img{
	margin-top: 15px;
	height: 240px;
	background: var(--color-gray);
	border-radius: var(--border-radius-2);
}
.ckchina .mhuSection--s1 .mhuGridItem__img img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	vertical-align: top;
}
.ckchina .mhuSection--s1 .mhuGridItem__text{
	padding-top: 15px;
	font-size: 18px;
	font-weight: var(--font-black);
	line-height: 1.8;
	color: var(--color-default);
}
/************************************************************************
* section2
************************************************************************/
.ckchina .mhuSection--s2 {
	padding-bottom: 150px;
	background: linear-gradient(#fff 0 35%, var(--color-primary) 35% 65%);
}
.ckchina .mhuSection--s2 .mhuTitle--sec {
	padding-bottom: 40px;
	font-size: 48px;
	font-weight: var(--font-black);
	line-height: 1.6;
	color: var(--color-primary);
	text-align: center;
}
.ckchina .mhuSection--s2 .mhuGrid-root{
	justify-content: space-between;
	gap: 20px;
}
.ckchina .mhuSection--s2 .mhuGridItem-root{
	display: flex;
	flex-direction: column;
	flex: 1;
	border-radius: var(--border-radius-2);
	overflow: hidden;
}
.ckchina .mhuSection--s2 .mhuGridItem__img{
	height: 240px;
	background: var(--color-gray);
}
.ckchina .mhuSection--s2 .mhuGridItem__img img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	vertical-align: top;
}
.ckchina .mhuSection--s2 .mhuGridItem__text-box {
	flex: 1;
	background: #fff;
	border-top: 3px solid var(--color-line);
	padding: 15px 20px 25px;
}
.ckchina .mhuSection--s2 .mhuGridItem__title{
	font-size: 36px;
	font-weight: var(--font-black);
	line-height: 1.6;
	color: var(--color-primary);
}
.ckchina .mhuSection--s2 .mhuGridItem__text{
	padding-top: 10px;
	font-size: 18px;
	font-weight: var(--font-regular);
	line-height: 1.8;
	color: var(--color-default);
}
/************************************************************************
* section3
************************************************************************/
.ckchina .mhuSection--s3 {
	padding-bottom: 189px;
	background: var(--color-primary);
}
.ckchina .mhuSection--s3 .mhuTitle--sec {
	padding-bottom: 50px;
	font-size: 48px;
	font-weight: var(--font-black);
	line-height: 1.6;
	color: #fff;
}
.ckchina .mhuSection--s3 .mhuTitle--sec .mhuTitle--sec__line {
	display: block;
}
.ckchina .mhuSection--s3 .mhuTitle--sec .mhuTitle--sec__line:last-child {
	text-indent: 50px;
}
.ckchina .mhuSection--s3 .mhuTitle--sec .mhuTitle--sec__point {
	font-weight: var(--font-black);
	color: var(--color-beige);
}
.ckchina .mhuSection--s3 .mhuItem-title-desc {
	padding-bottom: 70px;
}
.ckchina .mhuSection--s3 .mhuItem-title-desc .mhuItem-title-desc__dl {
	padding-top: 24px;
	display: flex;
	align-items: center;
}
.ckchina .mhuSection--s3 .mhuItem-title-desc .mhuItem-title-desc__dl:first-child {
	padding-top: 0;
}
.ckchina .mhuSection--s3 .mhuItem-title-desc .mhuItem-title-desc__dl dt {
	padding: 8px 24px 16px;
	background: var(--color-beige);
	border-radius: 40px;
	font-size: 36px;
	font-weight: var(--font-black);
	line-height: 1;
	color: var(--color-primary);
}
.ckchina .mhuSection--s3 .mhuItem-title-desc .mhuItem-title-desc__dl dd {
	padding-left: 14px;
	color: #fff;
	font-size: 36px;
	font-weight: var(--font-regular);
	line-height: 1.6;
}
.ckchina .mhuSection--s3 .mhuItem-desc-text {
	padding-top: 20px;
	text-align: right;
	font-size: 24px;
	font-weight: var(--font-black);
	line-height: 1;
	color: #fff;
}
.ckchina .mhuSection--s3 .mhuGrid-root {
	justify-content: space-between;
	gap: 14px;
	height: 296px;
}
.ckchina .mhuSection--s3 .mhuGridItem-root {
	display: flex;
	flex-direction: column;
	flex: 1;
	height: 100%;
	padding: 22px 13px;
	border-radius: 20px;
	overflow: hidden;
	background: var(--color-gray-20);
	transition: all 0.8s ease;
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuButtonBox-root {
	margin-top: auto;
	padding-top: 20px;
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuButtonBox-root .mhuButton-root {
	width: 100%;
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuButtonBox-root .mhuButton-root .mhuButton__text.mhuButton__text--more {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: space-between;
	white-space: nowrap;
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuGridItem__price {
	padding-top: 6px;
	font-size: 32px;
	font-weight: var(--font-black);
	line-height: 1;
	color: var(--color-primary);
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuGridItem__price-box {
	display: flex;
	flex-direction: column;
	flex: 1;
	justify-content: flex-end;
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuGridItem__discount {
	color: var(--color-error);
	font-weight: var(--font-black);
	opacity: 0;
	transition: opacity 1s ease;
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuGridItem__text {
	font-size: 30px;
	font-weight: var(--font-regular);
	line-height: 1.2;
	color: var(--color-default);
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuGridItem__text-sm {
	font-size: 32px;
	line-height: 1;
	opacity: 0;
}
.ckchina .mhuSection--s3 .mhuGridItem-root .mhuGridItem__text-lg {
	padding-top: 4px;
	font-size: 38px;
	line-height: 1.2;
	opacity: 0;
}
.ckchina .mhuSection--s3 .mhuGridItem-root.mhuState-active {
	background: #fff;
}
.ckchina .mhuSection--s3 .mhuGridItem-root.mhuState-active .mhuGridItem__text:after {
	content: "";
	width: 100%;
	height: 32px;
	position: absolute;
	top: 50%;
	left: 0;
	background: url("../img/main/img_discount_line.png") no-repeat 0 0 / 100% auto;
	transition: all 1s ease;
}
.ckchina .mhuSection--s3 .mhuGridItem-root.mhuState-active .mhuGridItem__discount {
	opacity: 1;
}
.ckchina .mhuSection--s3 .mhuGridItem-root.mhuState-active .mhuGridItem__text {
	position: relative;
	font-weight: var(--font-black);
	color: var(--color-gray-20);
}
/************************************************************************
* section4
************************************************************************/
.ckchina .mhuSection--s4 {
	padding: 120px 0;
	background: var(--color-gray-20);
}
.ckchina .mhuSection--s4 .mhuTitle--sec {
	padding-bottom: 60px;
	font-size: 48px;
	font-weight: var(--font-black);
	line-height: 1;
	color: var(--color-default);
	text-align: center;
}

.ckchina .mhuSection--s4 .mhuAccordion-root {

}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root {
	margin-top: 14px;
	border-radius: var(--border-radius-3);
	overflow: hidden;
}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root:first-child {
	margin-top: 0;
}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root .mhuAccordionHeader-root {
	background: #fff;
}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root .mhuAccordionHeader__button {
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-align: left;
	width: 100%;
	padding: 10px 10px 10px 30px;
	font-size: 24px;
	font-weight: var(--font-black);
	line-height: 1.6;
	color: var(--color-default);
}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root .mhuAccordionHeader__button:after {
	content: "";
	display: block;
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	background: url("../img/main/icon_expand_more.png") no-repeat 0 0 / 48px auto;
	transition: transform 0.15s ease;
}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root.mhuState-active .mhuAccordionHeader__button:after {
	transform: rotate(180deg);
}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root .mhuAccordionBody-root {
	padding: 20px 30px;
	display: none;
	border-top: 2px solid var(--color-default);
	font-size: 18px;
	font-weight: var(--font-black);
	line-height: 1.8;
	background: #fff;
	color: var(--color-default);
}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root.mhuState-active .mhuAccordionHeader-root {
	background: var(--color-gray);
}
.ckchina .mhuSection--s4 .mhuAccordion-root .mhuAccordionItem-root.mhuState-active .mhuAccordionBody-root {
	display: block;
}

.ckchina .mhuSection--s4 .mhuButtonBox-root {
	padding-top: 40px;
}
.ckchina .mhuSection--s4 .mhuButtonBox-root .mhuButton-root {
	width: 272px;
	margin: 0 auto;
}
.ckchina .mhuSection--s4 .mhuButtonBox-root .mhuButton-root .mhuButton__text.mhuButton__text--more {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: space-between;
}

/**** section3 - 무료이벤트 영역 : 이벤트 종료 시 주석 ****/
.ckchina .mhuItem-freeEvent {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 530px;
	background: var(--color-default);
	opacity: 0.95;
}
.ckchina .mhuItem-freeEvent__text-area {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 530px;
	padding-top: 120px;
	text-align: center;
}
.ckchina .mhuItem-freeEvent__title {
	color: #EC1717;
	text-align: center;
	font-size: 72px;
	font-weight: 900;
	line-height: 1.2;
}
.ckchina .mhuItem-freeEvent__date {
	font-size: 36px;
	font-weight: 900;
	line-height: 1.6;
	color: #fff;
}
.ckchina .mhuItem-freeEvent__text {
	font-size: 48px;
	font-weight: 900;
	line-height: 1.6;
	color: #fff;
}
.ckchina .mhuButton--main2 {
	width: 280px;
	margin-top: 30px;
	color: var(--color-default);
	background: #fff;
}
.ckchina .mhuSection--s3 {
	padding-bottom: 94px;
}
.ckchina .mhuSection--s3 .mhuItem-title-desc {
	padding-bottom: 151px;
}