.main-visual{
	position: relative;
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
}
.mv-wid{width: calc(100% - 40px);max-width: 1170px;margin: 0 auto;height: 645px;}
.mv-wid > p{padding-top: 165px;}
.mv-wid > p > span.mo{display: none;}
.main-visual > span {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	background: linear-gradient(rgba(28, 38, 91, 0.2), rgba(28, 38, 91, 0.2)),url("/images/klcp/main/mvbg_01.jpg") no-repeat center;
	background-size: cover;
	z-index: -1;
	opacity: 1;
	transform: scale(1.1, 1.1);
	transition: transform 15s ease-out, opacity 1s ease 0.1s;
	animation: scaleBackground 15s ease-out forwards;
}
@keyframes scaleBackground {
	0% {
		transform: scale(1.1, 1.1);
	}
	100% {
		transform: scale(1, 1);
	}
}


.msection1{width: 100%;margin: 0 auto;background: #ededed;}
.mic-area{position: relative;padding-bottom: 60px;}
.m-board-area{position: absolute;right: 0;top: -234px;width: 40%;height: 234px;box-sizIng: border-box;padding: 28px;background: #fff;}
.mb-more{
	position: absolute;
	right: 27px;
	top: 27px;
	display: inline-block;
	transition: transform 0.3s;
}
.mb-more:hover{
	transform: rotate(45deg);
}
.mb-btns{font-size: 0;margin-bottom: 24px;}
.mb-btns > li{display: inline-block;margin-right: 30px;position: relative;}
.mb-btns > li:after{content: "";position: absolute;right: -15px;top: 50%;width: 1px;height: 18px;background: #bfbfbf;margin-top: -9px;}
.mb-btns > li:last-child{margin-right:0;}
.mb-btns > li:last-child:after{display: none;}
.mb-btns > li > a{display: block;font-size: 18px;color: #5e5e5e;line-height: 1;font-weight: bold;}
.mb-btns.ch > li > a{font-family: NotoSansSC;}
.mb-btns > li.on > a{color: #ff2424;}
.mb-box{height: 135px;overflow: hidden;}
.mb-box > .mb_lines{display: none;}
.mb-box > .mb_lines.on{display: block;}
.mb-box > .mb_lines > ul > li{margin-bottom: 14px;}
.mb-box > .mb_lines > ul > li > a{display: block;font-size: 15px;color: #666;line-height: 1;width:99%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mb-box > .mb_lines > ul > li > a:hover{color:#3c497b;}
.mb-box > .mb_lines > ul > li:last-child{margin-bottom: 0;}

.mv-mark{position: absolute;right: 40px;bottom: 280px;padding: 15px 14px;background: rgba(255,255,255,0.88);border-radius: 15px;box-shadow: 5px 5px 5px rgba(9,2,4,0.7);z-index: 2;}
.mv-mark h4{margin-bottom: 14px;text-align: center;font-size: 15px;color: #171717; font-family: 'Pretendard', sans-serif;}
.mv-mark h4 span{display: block;margin-bottom: 5px;font-size: 23px;color: #014195;}
.mv-mark.ch h4 span{font-family: NotoSansSC;}
.mv-mark.jp h4 span{font-family: NotoSansJP;}
.mv-mark ul a{margin-top: 5px; text-align: center; padding: 10px 10px; border: 1px solid #2853bf;border-radius: 8px; max-width: 100px; display: block;}
.mv-mark.jp ul a{padding: 10px 5px;}
.mv-mark ul a:nth-child(1) {background: #2853bf; border: 1px solid #2853bf;}
.mv-mark ul a:nth-child(2) {background: #3ca7d4; border: 1px solid #3ca7d4;}
.mv-mark ul a:nth-child(3) {background: #818bba; border: 1px solid #818bba;}
.mv-mark ul a:nth-child(4) {background: #557cc3; border: 1px solid #557cc3;}
.mv-mark ul a:nth-child(5) {background: #218fe5; border: 1px solid #218fe5;}
.mv-mark ul a span{font-size: 16px;font-weight: bold; color: #FFFFFF!important;}
.mv-mark.ch ul a span{font-family: NotoSansSC;}
.mv-mark.jp ul a span{font-family: NotoSansJP; font-size: 15px;}

/* 홍보영상 배너 */
.mv-mark.video-link {
	bottom: 80px;
	width: 97px;
}
.mv-mark.video-link .character_img {
	/*animation: move1 0.7s infinite alternate;*/
	animation: move1 1s infinite;
	position: absolute;
	z-index: 99999;
	left: -38px;
	bottom: 135px;
	width: 50%;
}

@keyframes move1 {
	/*0% { transform:translate(0, 0);}*/
	/*100% { transform: translate(0, 8px);}*/
	0% { transform: rotate(0deg); }
	50% { transform: rotate(5deg); }
	100% { transform: rotate(0deg); }
}
.mic-box{position: relative;}
.mic-box:after{content: "";position: absolute;left:40%;width: 40%;top: 0;bottom: 0;height: 100%;background: url(/images/klcp/mc.jpg) center center no-repeat;background-size: cover;}
.mic-line{position: relative;z-index: 1;}
.mic-line > li{float: left;width: 20%;height: 234px;display: table;text-align: center;}
.mic-line > li > a{display: table-cell;vertical-align: middle;padding: 5px;}
.mic-line > li.bg1 > a{background: #2853bf;}
.mic-line > li.bg2 > a{background: #0e3151;}
.mic-line > li.bg3 > a{background: #fff;}
.mic-line > li.bg4 > a{background: rgba(14,49,81,0.8);}
.mic-line > li.bg5 > a{background: #3752c3;}
.mic-line > li.bg6 > a{background: #218fe5;}
.mic-line > li.bg7 > a{background: #fff;}
.mic-line > li > a > span{display: block;font-size: 0;margin-bottom: 15px;}
.mic-line > li > a > p{font-size: 15px;color: #fff;letter-spacing: -0.5px;line-height: 1.3;}
.mic-line > li > a > p > span{display: block;font-size: 22px;font-weight: bold;line-height: 1.1;margin-bottom: 10px;}
.mic-line.ch > li > a > p > span{font-family: NotoSansSC;}
.mic-line.jp > li > a > p > span{font-family: NotoSansJP;}
.mic-line > li.bg3 > a > p, .mic-line > li.bg7 > a > p{color: #3a3a3a;}
.mic-line > li.bg1{position: absolute;left: 40%;top: -234px;}
.mic-line > li.bg4{margin-left: 20%;}
.mic-line > li.bg6{margin-left: 20%;}
.mic-line > li.bg7{margin-left: 40%;}
.mic-line > li:hover > a > span{transform:rotateY(360deg);transition: all 0.4s ease-in-out;}

.msection2{width: calc(100% - 20px);max-width: 1170px;margin:0 auto;padding: 55px 0;}
.mfc-line{font-size: 0;text-align: center;margin-top: -20px;}
.mfc-line > li{display: inline-block;margin-top: 20px;vertical-align: top;}
.mfc-line > li > a{display: block;padding: 0 30px;}
.mfc-line > li > a > span{display: block;font-size: 0;}
.mfc-line > li > a > p{margin-top: 10px;font-size: 17px;color: #000;line-height:1.2;letter-spacing: -0.7px;font-weight: bold;}
.mfc-line > li:hover > a > span{transform:rotateY(360deg);transition: all 0.4s ease-in-out;}

/* 팝업 */

@keyframes slideIn {
	from {
		transform: translateY(100%);
	}
	to {
		transform: translateY(0);
	}
}

.pop-container {
	position: fixed;
	right: 10px;
	bottom: 10px;
	z-index: 1000;
}
.klcp-layer-popup {
	animation: slideIn 2s forwards;
}

.klcp-layer-popup .wrap {
	padding-top: 10px;
	padding-left: 10px;
}
.pop_main_v {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.klcp-layer-popup.main_noti {
	/*width: calc(50% - 5px);*/
	margin-bottom: 10px;
}
.klcp-layer-popup.main_noti {
	margin-right: 10px;
}
.klcp-layer-popup.main_noti:last-child {
	margin-right: 0px;
}
.klcp-layer-popup.main_noti .box.lg {
	max-width: 250px;
	height: auto;
	padding: 0;
	box-sizing: content-box !important;
	align-items: flex-end;
	display: flex;
	flex-direction: column;
	white-space: nowrap;
	justify-content: flex-end;
	border-top: 1px solid #424242;
	border-left: 1px solid #424242;
	border-right: 1px solid #424242;
	padding: 5px 5px;
	background: #424242;
}
.noti_check.combo label {
	color: #FFFFFF;
	font-size: 13px;
	font-family: 'Pretendard', sans-serif;
}
.buttonWrap {
	background: #424242;
	box-sizing: border-box;
	width: 100%;
	align-items: flex-end;
	display: -ms-flexbox;
	display: flex;
	white-space: nowrap;
	justify-content: space-between;
	margin-top: 5px;
	align-items: center;
}
.buttonWrap button {
	font-family: 'Pretendard', sans-serif;
}

@media screen and (max-width:1024px){
	.mv-wid{display: table;text-align: center;height: 540px;}
	.mv-wid > p{padding-top: 0;display: table-cell;vertical-align: middle;padding: 0 30px;}
	.mv-wid > p > span.pc{display: none;}
	.mv-wid > p > span.mo{display: block;}

	.mic-area{position: relative;padding: 25px 80px;}
	.mic-box:after{display: none;}
	.m-board-area{position: relative;right: auto;top: auto;width: 66.66666666%;margin-left: 33.33333333%;}
	.mic-line > li{width: 33.333333333%;}
	.mic-line > li.bg1{left: 0;top: -234px;}
	.mic-line > li.bg4{margin-left: 0;}
	.mic-line > li.bg6{margin-left: 0;}
	.mic-line > li.bg7{margin-left: 0;}
	.mic-line > li.bg4 > a{background: linear-gradient(rgba(28, 38, 91, 0.6), rgba(28, 38, 91, 0.6)), url(/images/klcp/mc.jpg) center center no-repeat;background-size: cover;}
	.msection2{display: none;}
	.mv-mark{bottom: 200px;}

	.mv-mark.video-link{
		display: none;
	}
	.promotional-video {
		position: fixed;
		bottom: 35px;
		left: 17px;
		height: 90px;
		z-index: 100;
		width: 140px;
		background: url(/images/klcp/main/character04.png) center center no-repeat;
		background-size: contain;
		padding-top: 100px;
		padding-bottom: 10px;
	}
	.promotional-video ul {
		padding-top: 7px;
		padding-left: 1px;
	}
	.promotional-video.en ul {
		padding-top: 10px;
	}
	.promotional-video img{
		width:150px;
	}
	.promotional-video > ul > a {
		padding: 8px 20px;
		margin-bottom: 5px;
		color: #fff;
		border-radius: 8px;
	}
	.promotional-video.en > ul > a{
		padding: 6px 4px;
	}
	.promotional-video.jp > ul > a{
		padding: 6px 19px;
	}
	.promotional-video.ch > ul > a{
		padding: 7px 18px;
	}
	.promotional-video > ul > a:nth-child(1) {background: #557cc3; border: 1px solid #557cc3;}
	.promotional-video > ul > a:nth-child(2) {background: #818bba; border: 1px solid #818bba;}
	.promotional-video > ul > a > span {
		font-weight: bold;
	}
	.promotional-video.en > ul > a > span {
		font-weight: bold;
		font-size: 12px;
	}
	.promotional-video.jp > ul > a > span {
		font-family: NotoSansJP;
	}
	.promotional-video.ch > ul > a > span {
		font-family: NotoSansSC;
	}
}

@media screen and (max-width:767px){
	.main-visual{
		background: linear-gradient(rgba(28, 38, 91, 0.2), rgba(28, 38, 91, 0.2)), url("/images/klcp/main/mvbg_mo_01.jpg") no-repeat center;
		background-size: cover;}
	.mv-wid{height: 370px;}
	.mv-wid > p > span.mo{display: block; margin-bottom: 200px;}
	.mic-area{position: relative;padding: 20px 0;}
	.mic-box{padding-bottom: 234px;}
	.m-board-area{width: 100%;margin-left: 0;}
	.mic-line > li{width: 50%;}
	.mic-line > li.bg1{position: static;}
	.mic-line > li.bg4{position: absolute;left: 50%;bottom: -234px;}
	.mic-line > li.bg4 > a{background: rgba(14,49,81,0.8);}
	.mic-box:after{display: block;left:0;width: 100%;top: auto;bottom: 0;height: 234px;background: url(/images/klcp/mc.jpg) center no-repeat;background-size: cover;}
	.mv-mark ul li span {font-size: 12px;}
	.mv-mark{right: auto;left: 50%;width: 70%;max-width: 310px;bottom: 25px;padding: 15px 14px;transform: translate(-50%, 0);}
	.mv-mark h4{margin-bottom: 12px;text-align: center;font-size: 18px;}
	.mv-mark h4 span{display: inline-block;margin-bottom: 0;font-size: 18px;color: #014195; margin-right: 10px;}
	.mv-mark ul{margin-top: -5px; display: flex; flex-wrap: wrap; justify-content: center;}
	.mv-mark ul a{margin-left: 3px; margin-right: 3px; flex: 0 0 38%; max-width: 125px; padding: 5px;}

	.mv-mark.video-link .character_img{display: none;}
}
@media screen and (max-width:545px) {

	/* 팝업 */
	.pop-container{left: 10px;}
	.klcp-layer-popup.main_noti {
		width: calc(90% - 5px);
	}
	.buttonWrap button {
		background-color: #ddd;
		border: none;
		padding: 2px 4px;
		border-radius: 5px;
		font-size: 14px;
	}
}


@media screen and (max-width:520px){
	.mv-wid{height: 333px;}
	.m-board-area{height: auto;padding: 20px 12px;}
	.mb-more{right: 10px;top: 21px;font-size: 10px;}
	.mb-btns{margin-bottom: 15px;}
	.mb-btns > li{margin-right: 14px;}
	.mb-btns > li:after{right: -7px;height: 13px;margin-top: -7px;}
	.mb-btns > li > a{font-size: 16px;}
	.mb-box{height: 110px;}
	.mb-box > .mb_lines > ul > li{margin-bottom: 10px;}
	.mb-box > .mb_lines > ul > li > a{font-size: 14px;}
	.mic-box{padding-bottom: 200px;}
	.mic-line > li{height: 200px;}
	.mic-line > li.bg4{bottom: -200px;}
	.mic-line > li > a > span img{width: 70px;}
	.mic-line > li > a > p{font-size: 14px;}
	.mic-line > li > a > p > span{font-size: 21px;margin-bottom: 8px;}
}

@media screen and (max-width:420px){
	.mv-wid{height: 333px;}
	.mic-box{padding-bottom: 180px;}
	.mic-line > li{height: 180px;}
	.mic-line > li.bg4{bottom: -180px;}
	.mic-line > li > a > p{font-size: 13px;}
	.mic-line > li > a > p > span{font-size: 19px;}
}