@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/jejugothic.css);

html, body, h1, h2, h3, h4, h5, h6, div, p, span, strong, em, address,ul, ol, li, dl, dt, dd, table, th, td, form, fieldset, input, select, label, textarea, img, a {margin:0; padding:0; font-family:'Jeju Gothic','돋움', verdana, sans-serif; font-size:12px; font-style:normal; line-height:16px;}
body, input, button {color:#555; font-family:'Jeju Gothic','돋움', verdana, sans-serif; font-size:12px; line-height:16px;}
ul, ol {list-style:none}
table {width:100%; border-spacing:0; border:0; border-collapse:collapse;}
img, button, fieldset {border:0;}
img, input, select, textarea, button {color:#000; font-family:'Jeju Gothic','돋움', verdana, sans-serif; font-size:12px; line-height:16px; vertical-align:top;}
caption, legend {overflow:hidden; visibility:hidden; height:0; font-size:0; line-height:0; z-index:-1;}
hr {display:none}
a {color:#000; text-decoration:none;}
a:hover {color:#000; text-decoration:none;}
label, button {cursor:pointer;}

/* input */
textarea {border:none; background-color:#fff; overflow-y:auto;}
input[type=radio], input[type=checkbox] {width:12px; height:12px; overflow:hidden;}
.skip, legend, .hidden {font-size:0; height:0; line-height:0; overflow:hidden; position:absolute; text-indent:-999em; width:0;}

#main_visual{width:500px; margin:0 auto; height:auto; position:relative;}
#main_visual img{width:100%;}
/*#teb_view{width:500px; margin:0 auto; overflow:hidden; position:relative;}*/
#teb_view{width:500px; margin:0 auto; overflow:hidden; position:relative;margin-top: 10px;}
/*#question{width:500px; height:155px; margin:10px auto; padding:10px 1px; overflow:hidden; position:relative ; background-color:#EEF0C9;}*/
#question{width:500px;  margin:10px auto; padding:10px 1px; overflow:hidden; position:relative ; background-color:#c4eefa; border:1px solid #DADADA; border-radius: 10px;}
/*#question .quest_text {display: inline-block; width: 120px;  height: 30px;  text-align: center; padding: 0px 0 0px 0; background-color: #ea9679; margin: 5px 2px 0 2px; padding-top: 10px; font-size:larger; font-weight: bold;border-radius:8px;}*/
#question .quest_text {display: inline-block; width: 120px;  height: 30px;  text-align: center; padding: 0px 0 0px 0; background-color: #81bbe4; margin: 5px 2px 0 2px; padding-top: 10px; font-size:larger; font-weight: bold;border-radius:8px;color:#000000;}
/*#question .q_title { height: 23px; display: block; background-color: #f7f7f7; padding-bottom:  2px; padding-top: 7px; padding-left: 5px; padding-right: 5px; margin-bottom: 5px; border: 1px solid #e2e2e2 }*/
#question .q_title { height: 23px; display: block;padding-bottom:  2px; padding-top: 7px; padding-left: 5px; padding-right: 5px; margin-bottom: 5px;}
.text_mp {width: 50%; float: left; text-align: center; padding-top: 10px; padding-bottom: 10px; background: #f7f7f7; font-size:14px; font-weight:bold;}

/*.list{ float:left; height:20px; padding-top:10px; padding-bottom:5px; position:absolute; right:35px;}*/
.list{ float:left; height:20px; padding-bottom:5px; position:absolute; right:35px;}
.list>li{float:left; margin-right:8px; }
/*.teb_btn{cursor:pointer;width:20px; display:inline-block;}*/
.teb_btn{cursor:pointer;width:40px; display:inline-block;}
.teb_btn img{width:100%;}
/*.hidden_btn{width:57px; background:#fff; display:inline-block; float:right; text-align:center; cursor:pointer;}*/
.hidden_btn{width:57px; height:25px; background:#fff; display:inline-block; float:right; text-align:center; cursor:pointer;margin-top: 11px;}
.hidden_btn img{margin-left:15px;}
.text_page{ position:absolute; left:0; top:50px;z-index:1;height:180px;width:480px; padding:8px; background:#fff; position:absolute; left:0; top:50px; border:2px solid #222;display:none;}
.on{display:block;}
/*.open_btn{width:57px; height:37px; background:#fff; display:inline-block; float:right;  text-align:center; cursor:pointer;  display: none;}*/
.open_btn{width:57px; height:25px; background:#fff; display:inline-block; float:right;  text-align:center; cursor:pointer;  display: none;margin-top:11px;}
.open_btn img{margin-left:15px;}
.testarea{cursor:pointer; position:absolute;bottom: 97px;left: 206px;width: 160px;height: 139px;}
.imgarea{display:none;position:absolute; width:127px; height:127px; border-radius:127px; overflow:hidden; border:5px solid #000;}
.arrow_box {z-index:100;padding:0 20px;height: 50px;border-radius: 6px;position: relative;background: #fff; border: 4px solid #c2e1f5;position:absolute; }
.arrow_box{display:none;line-height:50px; font-size:20px; font-weight:bold; text-align:center;height: 50px;border-radius: 6px;border: 2px solid #c2e1f5;position:absolute;}
.arrow_box:after, .arrow_box:before {top: 100%;left: 30%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}
.arrow_box:after {border-color: rgba(255, 255, 255, 0);border-top-color: #ffffff;border-width: 14px;margin-left: -16px;}
.arrow_box:before {border-color: rgba(194, 225, 245, 0);border-top-color: #c2e1f5;border-width: 16px;margin-left: -18px;}

.closebtn { cursor:pointer; }

/*.lang_list{width:100%; text-align:center; overflow:hidden;   border: 0 solid #DADADA; border-width: 0 0 1px 1px; margin-top:35px;}*/
 .lang_list{width:100%; text-align:center; overflow:hidden;   border: 0 solid #DADADA; margin-top:35px;}   
/*.lang_list li{cursor:pointer;float:left; width:123.8px; height:81px; background:rgb(247,247,247);  border: 0 solid #DADADA; border-width: 1px 1px 0 0; }*/
.lang_list li{cursor:pointer;float:left; width:123px; height:81px; background:rgb(247,247,247);  border: 0 solid #DADADA; border-width: 1px; border-radius: 10px;}
.lang_list li:hover{background: rgb(173, 249, 252);}
.lang_list li span{width:100%; height:35px; line-height:40px; display:block; font-size:14px; font-weight:bold; color: #000}
.lang_list li span.val{color:#1B4E66; height:auto; line-height:15px; font-size:13px;font-family: 'serif';}
/*파트별로 변경되어야 할 구간*/
.arrow01{top: -15px;right: 190px;}
.arrow02{left: 220px;top: 120px;}
.arrow03{right: 296px;bottom: 450px;}
.arrow04{right: 210px;bottom: 434px;}
.arrow05{left: 225px;bottom: 561px;}
.arrow06{left: 167px;top: 415px;}
.arrow07{right:325px;top: 282px;}
.arrow08{right:15px;top: 69px;}
.arrow09{left: 283px;bottom: 547px;}
.arrow10{right:154px;top:392px;}
.arrow11{left: 295px;bottom: 88px;}
.arrow12{left: 135px;bottom: 61px;}
.arrow13{left: 97px;bottom: 321px;}
.arrow14{left: 320px;bottom: 66px;}
.arrow15{left: 120px;bottom: 384px;}
.arrow16{left: 166px;bottom: 110px;}
.arrow17{left: 366px;bottom: 525px;}
.arrow18{left: 58px;bottom: 196px;}
.arrow19{left: 320px;bottom: 446px;}
.arrow20{left: 245px;bottom: 96px;}
.arrow21{left: 370px;bottom: 345px;}
.arrow22{left: -30px;bottom: 528px;}

.boxs{cursor:pointer; position:absolute; text-align:center;background:url('../image/back.png') left top no-repeat;}

.box001{width: 80px;height: 30px;top: 52px;right: 217px;}
.box002{width: 100px;height: 50px;left: 193px;top: 172px;}
.box003{width: 50px;height: 110px;right: 318px;bottom: 374px;}
.box004{width: 90px;height: 60px;right: 212px;bottom: 382px;}
.box005{width: 58px;height: 26px;left: 218px;bottom: 527px;}
.box006{width: 30px;height: 30px;left: 178px;top: 476px;}
.box007{width: 45px;height: 40px;right: 349px;top: 340px;z-index:2;}
.box008{width: 70px;height: 40px;right: 55px;top: 128px;}
.box009{width: 160px;height: 22px;left: 163px;bottom: 516px;}
.box010{width: 50px;height: 185px;right: 192px;top: 411px;}
.box011{width: 70px;height: 40px;left: 290px;bottom: 40px;z-index:2;}
.box012{width: 40px;height: 20px;left: 144px;bottom: 37px;}
.box013{width: 45px;height: 10px;left: 100px;bottom: 295px;}
.box014{width: 35px;height: 20px;left: 325px;bottom: 37px;}
.box015{width: 30px;height: 20px;left: 130px;bottom: 352px;}
.box016{width: 30px;height: 25px;left: 175px;bottom: 72px;}
.box017{width: 30px;height: 30px;left: 385px;bottom: 490px;}
.box018{width: 60px;height: 70px;left: 50px;bottom: 138px;z-index:2;}
.box019{width: 40px;height: 30px;left: 330px;bottom: 410px;}
.box020{width: 30px;height: 10px;left: 259px;bottom: 70px; z-index: 2;}
.box021{width: 100px;height: 60px;left: 350px;bottom: 290px;}
.box022{width: 10px;height: 10px;left: 0px;bottom: 518px;}

.h1{border-bottom:4px solid #BABABA; background:#161A42;  padding-left:30px; width:470px; margin:0 auto; height:50px; line-height:50px; font-size:30px; color:#FFF;}
/*h2 {padding: 5px; margin-bottom: 5px; background-color: rgb(195, 185, 151); color: #333; font-size: larger;}*/
h2 {padding: 5px 5px 5px 10px; margin-bottom: 5px; background-color: #6595d1; color: #333; font-size: larger;}
/*.h1>div { position: absolute;top: 0;margin-left: 150px;margin-top: 10px;font-size: 8pt;background-image: url('../image/spk.png');background-repeat: no-repeat;background-size: 25px;background-position-x: right;padding-right: 35px;}*/
.h1>div { position: absolute;top: 0;margin-left: 150px;margin-top: 10px;font-size: 8pt;background-image: url('../image/soundBtn.png');background-repeat: no-repeat;background-position-x: right;padding-right: 35px;cursor:pointer;width:270px;}

.rnumber-back {
	position: absolute;
	background-color:#FFF;
	left: 0;
	right:0;
	margin:0 auto;
	top: 0;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	text-align:center;
	font-weight: bold;
	margin-top:5px;
}

.rnumber-back2 {
	font-weight: bold;
	background-color:#FFF;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	text-align:center;
	left: 0;
	right:0;
	margin:2px 0 -7px 2px;
}



#oval1 {
position: absolute;
top:600px;
left:270px;
transform: rotate(15deg);

width: 80px;
height: 50px;
-moz-border-radius: 40px / 20px;
-webkit-border-radius: 40px / 20px;
border-radius: 40px / 20px;
border-color: yellow;
border-style: dotted;
z-index: 1;
}

#oval2 {
position: absolute;
top:340px;
left:80px;
transform: rotate(-52deg);

width: 80px;
height: 50px;
-moz-border-radius: 40px / 20px;
-webkit-border-radius: 40px / 20px;
border-radius: 40px / 20px;
border-color: yellow;
border-style: dotted;
z-index: 1;
}

.oval {

}

/*2015-01-17 수정사항 유현석*/
.q_ti{float:left; line-height:24px; width:45%; display:inline-block; text-align:left; padding-left:5%; margin:5px 0;}
#question .q_title { font-size:13px; font-weight:bold;}
input{margin:0 5px;}