@charset 'UTF-8';



/*모달 윈도우*/

input[id*="popup"]
{
	display:none;
}




input[id*="popup"] + label
{
	display:inline-block;

	background:#ffcd41;
	color:#0000CD;
	position:absolute;
	top:100px;
	right:10px;
	
	width:80px;
	height:32px;
	line-height:32px;

	text-align:center;
	font-weight:bold;
	border-radius:8px;
}

input[id*="popup"] + label + div
{
	opacity:0; visibility:hidden; transition:all 0.8s;
}

input[id*="popup"]:checked + label + div
{
	opacity:1; visibility:visible;
}


input[id*="popup"] + label + div
{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:100;
}

input[id*="popup"] + label + div > div
{
	position:absolute;
	top:0%;
	left:50%;
	transform:translate(-50%, 5%);
	width:85vw;
	height:90vh;
	background:#fff;
	z-index:2;
}

input[id*="popup"] + label + div > div > label
{
	position:absolute;
	top:0%;
	right:0%;
	transform:translate(40%, -40%);
	padding:20px;
	background:#dd5347;
	border-radius:100%;
	z-index:1;
}

input[id*="popup"] + label + div > label
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.9);
	z-index:1;
}



/*
input[id*='text_choice']
{
	position:absolute;
	left:-200%;
}

input[id*='text_choice'] + label
{
	background:#FFDBC1;
}


input[id*='text_choice']:checked + label
{
	background:#2828CD;
	color:#FFFFFF;
}

*/













/*선생님 문제풀이 문제 modal window*/

input[id*="teacher_modal"]
{
	display:none;
}


input[id*="teacher_modal"] + label
{
	display:inline-block;
	padding:20px;
	background:#ffcd41;
	color:#FFF;
}

input[id*="teacher_modal"] + label + div
{
	opacity:0; visibility:hidden; transition:all 1s;
}

input[id*="teacher_modal"]:checked + label + div
{
	opacity:1; visibility:visible;
}

input[id*="teacher_modal"] + label + div
{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:100;
}

input[id*="teacher_modal"] + label + div > div
{
	position:absolute;
	top:0;
	left:50%;
	transform:translate(-50%, 5%);
	width:90%;
	height:90%;
	background:#fff;
	z-index:2;
}

input[id*="teacher_modal"] + label + div > div > label
{
	position:absolute;
	top:0%;
	right:0%;
	transform: translate(40%, -40%);
	padding:20px;
	background:#dd5347;
	border-radius:100%;
	z-index:1;
}

input[id*="teacher_modal"] + label + div > label
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.9);
	z-index:1;
}










/*학생 오답노트 시리즈 문제풀이 문제 modal window*/

input[id*="student_modal"]
{
	display:none;
}


input[id*="student_modal"] + label
{
	display:inline-block;
	padding:20px;
	background:#ffcd41;
	color:#FFF;
}

input[id*="student_modal"] + label + div
{
	opacity:0; visibility:hidden; transition:all 1s;
}

input[id*="student_modal"]:checked + label + div
{
	opacity:1; visibility:visible;
}

input[id*="student_modal"] + label + div
{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:100;
}

input[id*="student_modal"] + label + div > div
{
	position:absolute;
	top:0;
	left:50%;
	transform:translate(-50%, 5%);
	width:90%;
	height:90%;
	background:#fff;
	z-index:2;
}

input[id*="student_modal"] + label + div > div > label
{
	position:absolute;
	top:0%;
	right:0%;
	transform: translate(40%, -40%);
	padding:20px;
	background:#dd5347;
	border-radius:100%;
	z-index:1;
}

input[id*="student_modal"] + label + div > label
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.9);
	z-index:1;
}