@charset "UTF-8";

/* CBT 모의고사 */
.CBT_exam * { font-family:Pretendard, sans-serif; color:#000; }
.CBT_exam { position:relative; text-align:center; }
.CBT_exam h2 { padding:100px 0 60px; }
.CBT_exam h3,.CBT_exam h4 { padding:120px 0 60px; }
.CBT_exam .quick a{display: block; margin-bottom: 15px;}
.CBT_exam .aside { position:absolute; right:0; top:210px; z-index:101; }
.CBT_exam .aside li { margin-bottom:15px; width:166px; height:150px; }
.CBT_exam .aside li a { display:block; width:100%; height:100%; }
.CBT_exam .aside li:nth-child(2) a,.CBT_exam .aside li:nth-child(3) a { font-size:22px; color:#fff; font-weight:500; box-sizing:border-box; text-align:right; padding:36px 18px 0 0; }
.CBT_exam .aside li:nth-child(2) a { background:url(images/aside_02.png) no-repeat; }
.CBT_exam .aside li:nth-child(3) a { background:url(images/aside_03.png) no-repeat; }
.CBT_exam img { vertical-align:top; }
.CBT_exam h2 { text-align:center; }
.CBT_exam .content_wrap { width:1270px; position:relative; margin:0 auto; padding-bottom:120px; }
.CBT_exam .topImg { position:relative; background:url(images/topBg.png) no-repeat 50% top; background-size:cover; height:1195px; padding-top:50px; }
.CBT_exam .paper { position:relative; background:url(images/paper.jpg) no-repeat center; height:936px; margin-top:38px; box-shadow:0px 15px 8px 2px rgba(0,0,0,.4); }
.CBT_exam .topImg li { position:absolute; }
.CBT_exam .img li:first-child { left:0; top:150px; z-index:10; }
.CBT_exam .img li:last-child { right:0; bottom:-84px; z-index:10; }
.CBT_exam .paper li:first-child { top:57px; left:115px; animation:fadeIn .3s .3s ease-out both; }
.CBT_exam .paper li:nth-child(2) { top:57px; right:120px; animation:fadeIn .3s .6s ease-out both; }
.CBT_exam .paper li:nth-child(3) { top:202px; left:209px; animation:width .2s 1s ease-in-out both; overflow:hidden; }
.CBT_exam .paper li:nth-child(4) { top:380px; left:210px; animation:blur .2s 1.4s ease-out both; }
.CBT_exam .paper li:nth-child(5) { bottom:80px; left:80px; animation:fadeIn .3s 1.7s ease-out both; }

.CBT_exam .section_01 { background:#005785; }
.CBT_exam .section_01 .counter { color:#fff; position:absolute; right:366px; top:110px; font-size:52px; letter-spacing:26px; text-align: right;}
.CBT_exam .section_01 ul { margin-bottom:257px; }
.CBT_exam .section_01 li { margin-top:40px; opacity:0; }
.CBT_exam .section_01 li.visible { animation:visible .3s ease-out both  }
.CBT_exam .section_01 li:first-child { margin-top:0; }
.CBT_exam .section_01 li:last-child { position:absolute; z-index:10; }
.CBT_exam .section_01 span { position:absolute; left:-30px; bottom:995px; z-index:9; animation:upDown 1.2s infinite ease-in-out; }

.CBT_exam .section_02 { background:#8ebdeb; }
.CBT_exam .section_02 ul { display:flex; margin-bottom:45px; }
.CBT_exam .section_02 ul li { width:50%; height:100px; }
.CBT_exam .section_02 li a { position:relative; display:block; width:100%; height:100%; background:#fff; color:#111; font-size:23px; padding-top:15px; }
.CBT_exam .section_02 li a.current { background:#005785; color:#fff; }
.CBT_exam .section_02 li a.current:after { position:absolute; left:50%; bottom:-17px; content:""; display:block; width:0px; height:0px; border-top:17px solid #005785; border-left:18px solid transparent; border-right:18px solid transparent; margin-left:-9px; }
.CBT_exam .section_02 li a strong { font-size:34px; display:block; padding-top:3px; }
.CBT_exam .section_02 li a.current strong { color:#fff; }
.CBT_exam .section_03 { background:#c8ebff; height:1116px; }
.CBT_exam .section_03 li { position:absolute; left:0; top:225px; z-index:10; display:none; }
.CBT_exam .section_03 p { position:absolute; left:0; top:225px; z-index:9; }

.CBT_exam .section_04 { background:#7eb0e6; }
.CBT_exam .section_04 ul { display:flex; margin-bottom:45px; }
.CBT_exam .section_04 ul li { width:50%; height:100px; }
.CBT_exam .section_04 li a { position:relative; display:block; width:100%; height:100%; background:#fff; color:#111; font-size:32px; padding-top:32px; font-weight:700; }
.CBT_exam .section_04 li a.current { background:#005785; color:#fff; }
.CBT_exam .section_04 li a.current:after { position:absolute; left:50%; bottom:-17px; content:""; display:block; width:0px; height:0px; border-top:17px solid #005785; border-left:18px solid transparent; border-right:18px solid transparent; margin-left:-9px; }
.CBT_exam .section_04 span { position:absolute; top:868px; right:150px; z-index:2; animation:upDown .8s  ease-out infinite; }
.CBT_exam .section_04 span.bottom { top:1415px; }
.CBT_exam .section_04 span.last { top:1960px;}


@keyframes fadeIn {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}

@keyframes visible {
	0% {
		opacity:0;
		transform: translateY(25%);
	}
	100% {
		opacity:1;
		transform: translateY(0%);
	}
}

@keyframes fadeIn_up {
	0% {
		transform: translateY(30%);
		opacity:0;
	}
	100% {
		opacity:1;
	}
}

@keyframes blur {
	0% {
		filter: blur(4px);
		transform: scale(1.18);
		opacity:0;
	}
	100% {
		opacity:1;
		filter: blur(0);
		transform: scale(1);
	}
}


@keyframes width {
	0% {
		width:0;
	}
	100% {
		width:834px;
	}
}


@keyframes upDown {
	0% {
		transform: translateY(0%);
	}
	50%{
		transform: translateY(-20%);
	}
	100% {
		transform: translateY(0%);
	}
}


@keyframes scale {
	0% {
		transform: scale(2);
		opacity:0;
	}
	100% {
		transform: scale(1);
		opacity:1;
	}
}
@keyframes scale_02 {
	0% {
		transform: scale(.5);
		opacity:0;
	}
	100% {
		transform: scale(1);
		opacity:1;
	}
}

@keyframes moter_01 {
	from {
		right:-50%;
	}

	90% {
		right:150%;
	}
	100% {
		right:150%;
	}
}
@keyframes moter_02 {
	0% {
		bottom:-60px;
	}
	100% {
		bottom:-58px;
	}
}

@media (max-width:1400px) {

}
