@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: #dbdbdb; margin: 5px 2px 0 2px; padding-top: 10px; font-size:larger; font-weight: bold;}*/
#question .quest_text { width: 100%;  height: 30px;  text-align: left; 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 }

.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:90px; 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(237,252,169);}
.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';}
*/
/** 이부분 수정 (강휴석) **/
.lang_list li:hover{background:rgb(173, 249, 252);}

/** 이 부분 수정 (강휴석) **/
.lang_list li span{width:100%; height:20px; 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: -50px;right: 340px;}
.arrow02{left: 200px;top: -53px;}
.arrow03{right: 14px;bottom: 685px;}
.arrow04{right: 325px;bottom: 515px;}
.arrow05{left: 27px;bottom: 345px;}
.arrow06{left: 280px;top: 115px;}
.arrow07{right:165px;top: 285px;}
.arrow08{right:10px;top: 288px;}
.arrow09{left: 9px;bottom: 176px;}
.arrow10{right:185px;top:458px;}
.arrow11{left: 350px;bottom: 177px;}

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

.box001{width: 150px;height: 160px;top: 12px;right: 340px;}
.box002{width: 150px;height: 160px;left: 175px;top: 12px;}
.box003{width: 150px;height: 160px;left: 340px;top: 12px;}
.box004{width: 150px;height: 160px;right: 340px;bottom: 347px;}
.box005{width: 150px;height: 160px;left: 11px;top: 349px;}
.box006{width: 313px;height: 160px;left: 175px;top: 180px;}
.box007{width: 150px;height: 160px;left: 175px;bottom: 178px;}
.box008{width: 150px;height: 160px;left: 339px;bottom: 178px;}
.box009{width: 150px;height: 160px;left: 12px;bottom: 8px;}
.box010{width: 150px;height: 160px;left: 175px;bottom: 8px;}
.box011{width: 150px;height: 160px;left: 338px;bottom: 8px;}

.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;
}

.rnumber-back2 {
	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;
}


/** 이 부분 수정 (강휴석) **/
.lang_list li.long{height:75px;}