/*±âº» ·¹ÀÌ¾Æ¿ô*/
.SectionHead{display: none;}
.SectionBody_event{border: none; margin-left: 94px;}
html,body{height: auto}
.clearfix:after{content: ''; display:block; clear:both}
#wrapper{
	background-color: #ececec;
	width:1001px;
	display: flex;
	justify-content: center;
}
#wrapper *{
	box-sizing: border-box;
	outline:none;
	-webkit-tap-highlight-color : transparent;
	font-family: 'GmarketSans', sans-serif;
}
.eventHeader,
.event_wrap > section{position: relative;}
.mo{display: none;}
.Wrapper{
	width:1000px; 
	position:relative;
	
}

/*º»¹® css*/
.eventWrap{
	background: rgb(52,117,197);
	background: linear-gradient(39deg, rgba(52,117,197,1) 0%, rgba(84,97,205,1) 29%, rgba(141,27,207,1) 100%);
}
.event_wrap{
	width: 840px;
}
/* .event_wrap img{
	image-rendering: -moz-crisp-edges;
	image-rendering: -o-crisp-edges;
	image-rendering: -webkit-optimize-contrast;
	-ms-interpolation-mode: nearest-neighbor;
	image-rendering: crisp-edges;
	transform:translateZ(0);
	backface-visibility:hidden;
} */
.backImg{
	display: flex;
	justify-content: center;
	overflow: hidden;
}
.submit{
	border-radius: 7px;
	font-size: 26px;
	padding: 15px;
	text-align: center;
	background-color: #4b1fb0;
	color: #fff;
	box-shadow: 2px 3px rgba(0,0,0,.2);
	margin-top: 40px;
}
.submit a{
	display: block;
	height: 100%;
}

.quizWrap{
	/* background: url(../images/back.jpg) no-repeat #3f73ca;
		background-position: top center; */
		display: flex;
		justify-content: center;
}
.quiz_wrap{
	background-color: #fff;
	width: 414px;
	padding:30px;
}
.top_wrap{
	font-size: 38px;
	font-weight: bold;
	color: #4b1fb0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
}
.top_wrap .num img{
	width: 28%;
	position: absolute;
	top: -25%;
	left: 0;
}
.top_wrap .num{
	display: inline-block;
	border-bottom: 5px solid #4b1fb0;
	padding-bottom: 2px;
}

.quiz_wrap .tit_wrap{
	word-break: keep-all;
	font-size: 24px;
	color: #333333;
	text-align: center;
	line-height: 1.4em;
	font-weight: normal;
	margin: 30px 0;
}
.tit_wrap .sub{
	font-size: 15px;
	margin: 5px 0 10px;
	color: #888;
	line-height: 1.5em;
	word-break: keep-all;
}
.quiz_wrap .tit_wrap b{
	font-weight: bold;
}
.quiz_wrap textarea{
	resize: none;
	border: 3px solid #cccccc;
	border-radius: 10px;
	padding: 20px;
	font-size: 20px;
	margin: 20px 0;
	width: 100%;
}

.popWrap{
	position: fixed;
	top: 0;
	left: 0;
	background: rgba(0,0,0,.2);
	width: 100vw;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9;
	/* display: none; */
}
.pop_wrap{
	background-color: #fff;
	border-radius: 20px;
	padding: 30px;
	font-size: 18px;
	font-weight: normal;
	color: #444444;
	width: 90%;
	position: relative;
	max-width: 500px;
	word-break: keep-all;
}

.pop_wrap .popX{
	display: block;
	position: absolute;
	top: 20px;
	right: 20px;
	width: 30px;
	height: 30px
}
.pop_wrap .popX::before,
.pop_wrap .popX::after{
	content: '';
	display: inline-block;
	width: 32px;
	height: 0;
	border-top: 3px solid #aaaaaa;
	transform: rotate(45deg);
	position: absolute;
	top: 15px;
	right: 0;
}
.pop_wrap .popX::after{
	transform: rotate(-45deg);
}

.quizWrap .pop_wrap{
	text-align: center;
	padding: 70px 30px;
	max-height: 90vh;
	overflow-y: auto;
}

.quizWrap .pop_wrap .tit_wrap{
	margin-bottom: 30px;
}
.quizWrap .pop_wrap .tit{
	color:#333;
	font-size: 36px;
	font-weight: bold;
	position: relative;
	display: inline-block;
}
.quizWrap .pop_wrap .tit .txt{
	position: relative;
	z-index: 1;
	color: #c454ee;
}
.quizWrap .pop_wrap .tit .border{
	display: block;
	width: 100%;
	height: 70%;
	background-color: #fff2aa;
	position: absolute;
	bottom: 0;
	left: 0;
}

.quizWrap .pop_wrap .cont{
	font-size: 20px;
	color: #333333;
	line-height: 1.55em;
	word-break: keep-all;
}
.quizWrap .pop_wrap img{
	width: 100%;
}


@media all and (max-width:768px){
	/*layout reset*/
	html, body{
		min-width: auto;
		margin: 0;
		overflow-x: hidden;
	}
	header, 
	.footerWrap, 
	.web{
		display: none;
	}
	.evBody,
	.SectionBody_event,
	.Wrapper,
	#wrapper,
	.eventWrap,
	.wrap{
		margin: 0 !important;
		padding: 0 !important;
		width: 100% !important;
	}
	#wrapper{
		border: none;
	}
	.mo{
		display: block;
	}
	.width100{
		width: 100%;
	}
	#wrap{
		width: 100% !important;
	}

	.event_wrap{
		width: 100%;
	}
	/* .eventHeader{
		background-color: #3f73ca;
	} */
	.mainTxt{
		width: 100%;
		max-width: 414px;
		padding:0 3%
	}
	.mainTxt img{
		width: 100%;
	}
	
	.quizWrap .pop_wrap .tit{
		font-size: 30px;
	}
}

@media all and (max-width:425px){
	body.EventBody{
		min-height: 95vh;
		background-color: #3f73ca !important;
	}
	#wrapper{
		overflow: hidden;
	}
	.backImg{
		width: 100%;
	}

	.quiz_wrap{
		width: 90%;
	}
	.quizWrap .pop_wrap .tit{
		font-size: 23px;
	}
	/* .mainTxt{
		width: 100%;
	}
	.mainTxt img{
		width: 100%;
	}
	.event_wrap{
		width: 100%;
	} */
	.quizWrap .pop_wrap .cont{
		font-size: 16px;
	}
	.submit{
		margin: 40px auto 0;
		width: 90% !important;
	}
	.quiz_wrap .submit{
		width: 100% !important;
	}
	.top_wrap .num img{
		top: -20%;
	}
	.quiz_wrap .score_list li{
		font-size: 25px;
	}
}

@media all and (max-width:320px){
	.submit{
		font-size: 20px;
	}
	.mainTxt{
		font-size: 30px;
	}
	.top_wrap,
	.quiz_wrap li{
		font-size: 25px;
	}
	.quiz_wrap .tit_wrap{
		font-size: 16px;
	}
	.quizWrap .pop_wrap .tit{
		font-size: 23px;
	}
	.quizWrap .pop_wrap .cont{
		font-size: 14px;
	}
}