@charset "euc-kr";
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap');

html { min-width: 1280px; }
body { 
	font-family: 'Noto Sans KR', sans-serif;
	color: #424242;
	background: #007e58; 
	word-spacing: -1px;
}


/* °øÅë
------------------------------------------------------ */
section { 
	margin: 0 auto; 
	width: 1100px;
}
.ged-quiz .header section,
.ged_hd section { 
	width: 1200px; 
}

/* ¹öÆ° */
.btn_quiz { 
	display: block;
	margin: 4px 0 0;
	width: 100%; height: 42px;
	line-height: 39px;
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 16px;
	font-weight: 700; 
	color: #fff;
	background: #f29b11;
	background: #f9a825;
	letter-spacing: -0.5px;
	text-align: center;
	cursor: pointer;
	outline: none;
	-webkit-transition: background .3s;
	transition: background .3s;
}
.btn_quiz>span { 
	margin: 0 0 0 2px;
	font-weight: 300; 
	vertical-align: baseline;
}
.btn_quiz:hover { 
	background: #ff8f00;
}



/* ¸ÞÀÎ
------------------------------------------------------ */
.qm_main {
	padding: 160px 0 0;
	background: url('/quiz/images/bg_main.png') no-repeat 50% 0;
}
.qm_hd { 
	text-align: center; 
}


/* -------- ŸÀÌƲ -------- */
.qm_hd h1 { 
	height: 413px;
	background: url('/quiz/images/quiz_title.png') no-repeat 50% 0; 
	text-indent: -9999px;
}
.qm_hd p { 
	margin: 110px 0 0;
	line-height: 36px;
	font-size: 22px;
	font-weight: 300;
	color: #b4e3d5;
	letter-spacing: -1px;
}
.qm_hd p>b { 
	font-weight: 700; 
	color: #fff;
}
.qm_hd p>span { 
	display: inline-block;
	width: 360px; height: 33px;
	line-height: 33px;
	font-size: 15px;
	font-weight: 500;
	color: #46b292;
	background: #035f43;
	border-radius: 20px;
}
.qm_hd p>span>b { 
	color: #2fd8a4; 
}


/* -------- ¹®Á¦¸®½ºÆ® -------- */
.qm_bd { 
	margin: 90px auto 120px;
	padding: 70px 91px 75px;
	width: 910px;
	background: #362b23;
	border: solid 4px #efc56a;
	border-radius: 15px;
	text-align: center;
}

/* ŸÀÌƲ */
.qm_bd h2 { 
	height: 140px;
	background: url('/quiz/images/quiz_list_title.png') no-repeat 50% 0;
	text-indent: -9999px;
}

/* ¸®½ºÆ® */
.qm_bd ul { 
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.qm_bd li { 
	/* padding: 50px 25px 0; */
	width: 220px; /* height: 220px; */
	background: url('/quiz/images/bg_quiz_list.png') no-repeat 50% 0;
	text-align: center;
	/* 2019-10-07 #¼öÁ¤ */
	padding: 50px 25px 20px;
	height: 100%;
}
.qm_bd li:last-child { 
	margin: 60px 0 0 !important;
	padding: 19px 2% 20px;
	width: 96%;
	font-size: 16px;
	font-weight: 400;
	color: #fff;
	background: none;
	background-color: #007e58;
	/* border: solid 1px #8d6e63; */
}
.qm_bd li .btn_quiz:last-child { 
	display: none; 
}
.qm_bd li:nth-child(n+4) { 
	margin: 50px 0 0; 
}
.qm_bd h3 { 
	height: 110px;
	line-height: 75px;
	/* font-size: 24px; */
	font-weight: 700;
	color: #212121; 
	/* letter-spacing: -1px; */
	/* 2019-10-11 #¼öÁ¤ ±ÛÀÚ¼ö ÃÊ°ú½Ã ¹Ð·Á³ª´Â ¹®Á¦ */
	font-size: 22px;
	letter-spacing: -2px;
	word-spacing: -2px;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-wrap: normal;
	overflow: hidden;
}
.qm_bd h3:before { 
	content: "±¹°¡ÀÚ°ÝÁõ ±âÃâ ¹®Á¦";
	display: block;
	clear: both;
	padding: 10px 0;
	line-height: 1;
	font-size: 13px;
	font-weight: 400;
	color: #9c9c9c;
	border: solid #d5d5d5;
	border-width: 1px 0;
	letter-spacing: 0;
}

/* ¹öÆ° */
.btn_quiz.down { 
	background: #26a69a;  
}
.btn_quiz.down>span { 
	display: none;  
}
.btn_quiz.down:hover { 
	background: #009688; 
}


/* -------- ¼­ºñ½º¾È³» -------- */
.qm_ft {
	width: 100%;
	font-size: 16px;
	color: #85c0ad;
	background: #04573e; 
}
.qm_ft>section { 
	position: relative;
	padding: 70px 0 90px;
}
.qm_ft>section:before { 
	content: "±âÃâ¹®Á¦ Ç®ÀÌ ¼­ºñ½º ¾È³»"; 
	display: block;
	clear: both;
	position: absolute; top: 0; right: 20px;
	width: 270px; height: 40px;
	font-weight: 700;
	color: #9ce4b7;
	background: #007e58;
	text-align: center;
}
.qm_ft h4 { 
	margin: 50px 0 0;
	font-weight: 700; 
	color: #a7dccd;
}
.qm_ft h4:first-child { 
	margin: 0; 
}
.qm_ft h4+p { 
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	margin: 15px 0 0;
	padding: 0 20px;
}
.qm_ft h4+p>span {
	margin: 0 0 0 100px;
	line-height: 24px;
}
.qm_ft h4+p>span:first-child { 
	margin: 0; 
}
.qm_ft h4+p>span:before { 
	 content: "";
	 display: inline-block;
	 clear: both;
	 position: relative; left: -10px; top: -2px;
	 margin: 0 0 0 -3px;
	 width: 3px; height: 7px;
	 background: #00c47b;
}


/* -------- ·¹À̾îÆ˾÷ -------- */
.qm_pop { 
	position: fixed; left: 50%; top: 50%;
	margin-top: -15%;
	width: 640px; height: auto;
	font-size: 17px;
	color: #424242;
	background: #f8eedd;
	border: 0;
	text-align: center;
	box-shadow: 5px 9px 60px;
	transform: translate(-50%);
	display:none;
}
.qm_pop .qm_pop_con { 
	padding: 20px 0; 
	height: 360px;
}
.qm_pop .pop_tit { 
	 height: 90px;
	 line-height: 90px;
	 font-size: 27px;
	 font-weight: 700;
	 color: #212121;
}
.qm_pop .pop_con { 
	margin: 0 0 0 40px;
	padding: 18px 0 22px 50px;
	width: 550px; height: 90px;
	font-size: 20px;
	background: #fff;
	border-radius: 15px 0 0 15px;
	text-align: left;
}
.qm_pop li { 
	height: 45px;
	line-height: 45px; 
}
.qm_pop span, 
.qm_pop label { 
	vertical-align: middle; 
}
.qm_pop input { 
	margin: 0 7px 0 0; 
}
.qm_pop span { 
	margin: 0 50px 0 0;
	font-weight: 700;
	color: #212121;
	letter-spacing: -1px;
}
.qm_pop span.bar { 
	margin: 0 20px; 
}
.qm_pop li.case { 
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
.qm_pop li.case select { 
	display: none; 
	margin: 0 0 0 10px;
	width: 100px; height: 32px;
	line-height: 32px;
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 16px;
	font-weight: 400;
	color: #424242;
	border: solid 1px #b5b5b5;
	outline: none;
}
.qm_pop li.case input:checked ~ label { 
	color: #9e9e9e; 
}
.qm_pop li.case input:checked ~ select { 
	display: inline-block;
}
.qm_pop p { 
	height: 75px;
	line-height: 75px;
	font-size: 17px; 
	color: #757575;
}
.qm_pop .btn_quiz { 
	margin: 0 auto;
	width: 200px; height: 51px;
	line-height: 51px;
	font-size: 20px;
}
.qm_pop .btn_close { 
	padding: 0 25px;
	line-height: 50px;
	background: #fff;
	text-align: right;
	cursor: pointer;
}



/* ¼­ºê
------------------------------------------------------ */
.qs_sub {
	padding: 0 0 100px;
	min-height: 850px;
	background: url('/quiz/images/bg_sub.png') no-repeat 50% 0;
}
.qs_hd { 
	text-align: center; 
}
.qs_tit { 
	margin: 0 auto;
	width: 1100px; height: 170px;
	text-indent: -9999px;
}
.qs_co {
	letter-spacing: -0.5px;
}
.qs_co .btn_correct { 
	position: relative; 
	z-index: 0;
}
.qs_co .btn_correct:before { 
	content: "";
	display: inline-block;
	clear: both;
	position: absolute; left: 50%; top: 10px;
	width: 103%; height: 12px;
	transform: translateX(-50%);
	z-index: -1;
}


/* PDF ´Ù¿î·Îµå
------------------------------------------------------ */
.qs_tit_settle { 
	height: 200px;
	background: url('/quiz/images/bg_title_settle.png') no-repeat 50% 100%;
}
.qs_settle { 
	padding: 0 0 70px;
	width: 1000px;
	background: #fff;
}
.qs_notice { 
	 display: block;
	 padding: 0 30px 0 0;
	 line-height: 60px;
	 font-size: 17px;
	 background: #ffecb3;
	 /* color: #fff; */
	 background: #f57f17;
	 background: #f2f2f2;
	 letter-spacing: -0.4px;
	 text-align: left;
}
.qs_notice>b { 
	display: inline-block;
	margin: 0 20px 0 0;
	padding: 0 50px;
	color: #fff;
	background: #ef6c00;
	background: #26a69a;
	background: #212121;
}
.qs_notice>em { 
	font-weight: 700; 
	color: #ef6c00;
	text-decoration: underline;
}
.qs_settle table {
	margin: 70px auto 0;
	padding: 0;
	width: 870px;
	font-size: 17px;
	background: #fff;
	border: 0;
	border-collapse: collapse;
	text-align: center;
}
.qs_settle th { 
	padding: 10px 0; 
	font-size: 15px;
	color: #fff;
	background: #757575;
}
.qs_settle td { 
	padding: 15px 0; 
	font-size: 17px;
	border-bottom: solid 1px #ccc;
}
.qs_settle td input[type=text] { 
	padding: 0;
	width: 120px; height: 30px;
	line-height: 30px;
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 16px;
	color: #ef6c00;
	border: solid 1px #ccc; 
	text-align: center;
	vertical-align: top;
}
.qs_settle td input[type=text]:focus { 
	border-color: #424242; 
	outline: none;
}
.qs_settle .qs_pay th { 
	background: #26a69a;
}
.qs_settle>p {
	margin: 30px 0 0;
	text-align: center; 
}
.qs_settle>p>a { 
	 display: inline-block;
	 margin: 0 5px;
	 width: 200px; height: 51px;
	 line-height: 51px;
}


/* quiz
------------------------------------------------------ */
.qs_tit_quiz { 
	background: url('/quiz/images/bg_title_quiz.png') no-repeat 50% 0;  
}

/* -------- ±âÃâ¹®Á¦ -------- */
.qs_quiz { 
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	color: #424242;
}

/* ¹®Á¦Ç®±â */
.qs_q { 
	width: 747px;
	background: #fff;
	border-bottom: solid 4px #efc56a;
}
.qs_q .qs_q_tit { 
	height: 60px;
	line-height: 60px;
	font-size: 21px;
	font-weight: 500;
	color: #212121;
	background: url('/quiz/images/bg_quiz_q.png') repeat-y 50% 0;
	letter-spacing: -0.5px;
	text-align: center;
}
.qs_q .qs_q_con { 
	 padding: 0 75px 50px;
}

/* ¹®Á¦ */
.qs_q_con .q_item {
	/* padding: 50px 0 0; */
	padding: 70px 0 0;
	word-spacing: -1px;
}
.qs_q_con .q_item:first-child { 
	padding-top: 50px; 
}
.q_item:after { 
	content: "";
	display: block;
	clear: both;
}
.q_item .q_num { 
	float: left;
	width: 100px;
	font-family: 'Open Sans', sans-serif;
	font-size: 24px;
	font-weight: 700;
	color: #212121;
	text-decoration: underline;
}
.q_item .q_quiz { 
	float: left;
	width: 497px;
}
/* .q_item .q_quiz br { 
	display: none; 
} */
.q_item .q_quiz img {
	display: block;
	margin: 10px 0;
	max-width: 100%; 
	line-height: 0;
}
.q_item .q_quiz h4 { 
	position: relative; top: 2px;
	line-height: 1.4;
	font-size: 19px;
	color: #212121;
}
.q_item .q_quiz ul { 
	/* margin: 20px 0 0; */
	margin: 35px 0 0;
}
.q_item .q_quiz li { 
	margin: 0 0 7px;
	line-height: 1.5; 
}
.q_item .q_quiz li * { 
	/* height: 30px;
	line-height: 30px; */
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 16px;
	letter-spacing: -0.5px;
}
.q_item .q_quiz li button { 
	margin: 0 7px 0 0;
	width: 20px;
	vertical-align: inherit;
	outline: none; 
}
.q_item .q_quiz li button+span { 
	cursor: default; 
}

/* ÆäÀÌÁöÀ̵¿ */
.qs_q_pg { 
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 50px;
}
.qs_q_pg .btn_pager { 
	display: block;
	margin: 26px 0;
	width: 90px; height: 38px;
	background-repeat: no-repeat;
	background-position: 0 50%;
}
.qs_q_pg .btn_prev { 
	background-image: url('/quiz/images/btn_prev.png'); 
}
.qs_q_pg .btn_next { 
	background-image: url('/quiz/images/btn_next.png');
}
.qs_quiz .qs_co { 
	margin: auto;
	height: 22px;
	font-size: 14px; 
	color: #757575;
}
.qs_quiz .qs_co .btn_correct:before { 
	background: #fff9c4; 
}

/* -------- ´ä¾ÈÁö -------- */
.qs_rs { 
	position: fixed; left: 50%; top: 170px;
	width: 336px; height: auto;
	background: #f7f7f7;
	transform: translateX(217px);
}
/* .qs_rs { 
	position: fixed; left: 50%;
	width: 336px; height: auto;
	background: #f7f7f7;
	transform: translateX(217px);
	z-index: 9999;
}
.qs_rs_fix { 
	top: 0;
} */
.qs_rs .qs_rs_tit { 
	padding: 0 30px;
	height: 60px;
	line-height: 60px;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
	background: #1c46a6;
}
.qs_rs .qs_rs_tit:before { 
	 content: "";
	 display: inline-block;
	 clear: both;
	 position: relative; top: -5px;
	 margin: 0 7px 0 0;
	 width: 3px; height: 3px;
	 background: #4fd1d9;
}
.qs_rs .qs_rs_tit .btn_spr { 
	display: inline-block;
	position: relative; top: 2px;
	margin: 0 0 0 5px;
	width: 30px;
	font-size: 19px;
	text-align: center;
	cursor: pointer; 
}

/* ´ä¾ÈÁö */
.qs_rs .qs_rs_con { 
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	padding: 10px 0;
}
.qs_rs_con>div { 
	margin: 0 1.5%;
	width: 30%;
}
.qs_rs_con ul { 
	font-size: 0; 
	text-align: center;
}
.qs_rs_con li { 
	display: inline-block; 
	line-height: 1.8;
	font-size: 14px;
}
.qs_rs_con li.num { 
	width: 25px; 
	font-family: 'Open Sans', sans-serif;
	font-size: 12px;
	color: #212121;
}
.qs_rs_con li button {
	margin: 0 1px 0 0;
	font-family: 'Noto Sans KR', sans-serif;
	outline: none; 
}

/* ½ÃÇè¿Ï·á ¹öÆ° */
.qs_rs .btn_a {
	display: block;
	height: 65px;
	line-height: 65px;
	font-size: 21px;
	font-weight: 500;
	color: #fff;
	background: #232837; 
	text-align: center; 
}


/* grade
------------------------------------------------------ */
.qs_tit_grade { 
	background: url('/quiz/images/bg_title_grade.png') no-repeat 50% 0;   
}

/* ÀÀ½Ã°á°ú */
.qs_result .qs_emoji {
	text-align: center;
}
.qs_emoji img {
	width: 140px; height: auto;
}
.qs_result ul {
	position: relative; top: -20px;
	margin: auto; 
	padding: 10px 50px 30px;
	width: 380px;
	background: #fff;
	border: dashed #007e58;
	border-width: 0 0 3px;
	text-align: left;
	z-index: 1;
}
.qs_result li {
	padding: 15px 0;
	font-size: 24px;
	font-weight: 300;
	color: #424242;
	border-bottom: solid 1px #d5d5d5;
	letter-spacing: -0.5px;
}
.qs_result li:last-child { 
	border-bottom: 0; 
}
.qs_result li span { 
	display: inline-block;
	width: 80px;
	font-size: 18px;
	font-weight: 700;
	color: #212121;
}
.qs_result li b {
	font-weight: 700;
	color: #ff511c; 
}
.qs_result li b+span { 
	display: block;
	width: auto;
	font-weight: 300;
	color: #757575;
	text-align: left;
	text-indent: 81px; 
}
.qs_result li.qs_status {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0;
	height: 100px;
	background: url('/quiz/images/bg_status.png') repeat-x 0 50%;
}
.qs_result li.qs_status span { 
	display: inline-block; 
	padding: 0 30px;
	width: auto;
	font-size: 40px;
	font-weight: 300;
	background: #fff;
	text-align: center;
}

/* Á¤Á¤¿äû */
.qs_co { 
	margin: 0 auto 70px;
	font-size: 15px; 
	color: #fff;
}
.qs_co .btn_correct:before { 
	background: #04573e;
}

/* -------- ¹®Á¦Ç®ÀÌ -------- */
.qs_grade { 
	margin: 0 auto; 
	width: 1000px;
}
.qs_grade .qs_q_con { 
	padding: 0;
}
.qs_grade .q_item {
	padding: 50px;
	border-bottom: dashed 2px #007e58; 
}
.qs_grade .q_item:last-child { 
	border-bottom: 0; 
}
.qs_grade .q_num { 
	margin: 0 0 0 90px; 
}
.qs_grade .q_quiz { 
	margin: 0 0 80px; 
}

/* µµ¿ò¸» */
.q_chk { 
	padding: 0 50px;
	/* height: 60px;
	line-height: 60px; */
	height: 20px;
	font-size: 16px;
	color: #f5f5f5;
	background: #04573e;
	text-indent: -10000px;
}
.q_chk>.chk_o { 
	color: #ff511c ; 
}
.q_chk>.chk_x { 
	color: #b5b5b5 ; 
}

/* Á¤´ä */
.qs_grade .q_cmt { 
	clear: both;
	position: relative;
	margin: 0 auto 0;
	padding: 15px 70px 15px 130px;
	width: auto;
	font-size: 16px;
	color: #757575;
	background: #f2f2f2;
	border-radius: 10px;
	box-sizing: border-box;
	word-break: break-all;
}
.qs_grade .icon_ans { 
	position: absolute; left: 30px; top: -50px;
	width: 70px; height: 70px;
	background: url('/quiz/images/icon_ans.png') no-repeat 0 0;
}
.qs_grade .q_ans { 
	position: absolute; left: 130px; top: -40px;
	height: 40px;
	line-height: 40px;
	font-weight: 700;
	color: #212121;
}
.qs_grade .q_ans>b {   
	margin: 0 0 0 15px; 
	color: #ff511c;
}

/* -------- Á¤´ä&¿À´äüũ -------- */
/* »öÀ¸·Î Á¤´ä/¿À´äüũ
.qs_grade .q_num.chk_rs { 
	color: #ff511c !important;
}
.qs_grade .q_num:not(.chk_rs) {
	color: #b5b5b5 !important;
} 
*/
.qs_grade .q_num.chk_rs,
.qs_grade .q_num:not(.chk_rs) { 
	height: 48px;
	color: #b5b5b5 !important;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
}
.qs_grade .q_num.chk_rs { 
	background-image: url('/quiz/images/chk_rs_o.png');
}
.qs_grade .q_num:not(.chk_rs) {
	background-image: url('/quiz/images/chk_rs_x.png');
} 
.chk_on *,
.chk_on ~ span,
button.chk_on { 
	/* color: #26a69a !important;
	color: #ff511c !important; */
	color: #e67e22 !important;
}


/* 2019-10-21 #Ãß°¡ - header + footer
------------------------------------------------------ */
#header_wrap { 
	background: #fff; 
}

/* -------- µ¹¾Æ°¡±â ¹öÆ° -------- */
.q_return { 
	position: fixed; right: 0; bottom: 50px;
	display: block;
	padding: 0 50px 0 20px;
	height: 60px;
	line-height: 60px;
	font-size: 1.4rem;
	color: #fff !important;
	background: #ff511c;
	z-index: 99999;
}
.q_return i { 
	font-size: 1.4rem;
}