@charset "utf-8";

@import url('http://fonts.googleapis.com/earlyaccess/nanumgothic.css') ;
@import url('http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css') ;
@import url('http://fonts.googleapis.com/earlyaccess/notosansgeorgian.css') ;

* {
	margin : 0;
	padding : 0;
	transform : skew(-0.001deg);
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark {
	font-family : NanumGothic, '나눔고딕', "돋움", Dotum, Verdana, Arial, helvetica, clean, sans-serif;
	border : 0;
	outline : 0;
	background : transparent;
	font-size : 100%;
}

caption, tbody, tfoot, thead {outline : 0;background : transparent;font-size : 100%;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display : block;}
nav, ul {list-style : none;}
blockquote, q {quotes : none;}
blockquote:before, blockquote:after, q:before, q:after {content : '';content : none;}
body {
	font-family : NanumGothic, '나눔고딕', "돋움", Dotum, Verdana, Arial, helvetica, clean, sans-serif;
	color : #000;
	font-size : 14px;
	letter-spacing : -0.03em;
}

span.dpb {display : block;}
a {margin : 0;padding : 0;border : 0;font-size : 100%;}
ins {color : #000;text-decoration : none;}
mark {color : #000;font-style : italic;font-weight : bold;}
del {text-decoration : line-through;}
abbr[title], dfn[title] {border-bottom : 1px dotted #000;cursor : help;}
hr {
	display : block;
	height : 1px;
	border : 0;
	border-top : 1px solid #cccccc;
	margin : 1em 0;
	padding : 0;
}

select, input, button, textarea, button {
	font-family : NanumGothic, "나눔고딕", "돋움", Dotum, Verdana, Arial, helvetica, clean, sans-serif;
}

input {border : #ccc solid 1px;height : 16px;padding : 2px 3px 1px 3px;}
input[type="radio"], input[type="checkbox"] {border : none;padding : 0;margin : 0;}
input[type="file"] {border : 0;padding : 0;margin : 0;height : auto;}
table {font-size : inherit;font : 100%;}
pre, code, kbd, samp, tt {font-family : monospace;line-height : 100%;}
section h2.no_v, article h2.no_v {display : none;}
a {color : #555;text-decoration : none;}
a:visited, a:visited {color : #555;text-decoration : none;}
a.visited, a.visited:visited {color : #555;text-decoration : none;}
a:hover, a:hover, a.visited:hover {color : #555;text-decoration : none;}
li {list-style : none;}
ul.fllistli {float : left;}
ul.fllist:after {clear : both;display : block;content : "";}
ol.onumli {list-style-type : decimal;}
.onum {padding-left : 22px;}

input.text, input.password {
	border-left : 1px solid #cbcbcb;
	border-top : 1px solid #cbcbcb;
	border-right : 1px solid #e4e4e4;
	border-bottom : 1px solid #e4e4e4;
	background : #f8f8f8;
	height : 28px;
	line-height : 28px;
	padding : 0 5px;
}

input.file {
	border : #ddd solid 1px;
	height : 16px;
	padding : 2px;
	font-size : 100%;
	line-height : 110%;
}

input.image, input.radio, input.checkbox {
	border : 0 !important ;
	vertical-align : middle;
	padding : 0;
	margin : 0;
}

input.num {
	text-align : right;
	border : #ddd solid 1px;
	height : 16px;
	padding : 2px;
	font-size : 100%;
	line-height : 110%;
}

input.readonly {background-color : #f7f7f7;}
textarea {border : #ddd solid 1px;padding : 2px 5px;}
select.select {
	border : #ddd solid 1px;
	height : 28px;
	vertical-align : top;
	line-height : 28px;
	min-width : 60px;
}


#myBtn, #myBtn1 {cursor : pointer;}
#myBtn a, #myBtn1 a {display : block;text-indent : -99999px;}
#myBtn a {width : 120px;height : 55px;}
#myBtn1 a {width : 115px;height : 55px;}

#myBtn {
	background-image : url('../images/common/footer_mark2.png');
	width : 120px;
	height : 55px;
	float : left;
	cursor : pointer;
	background-repeat:no-repeat;
}

#myBtn:hover {
	background-image : url('../images/common/footer_mark2_on.png');
	width : 120px;
	height : 55px;
	float : left;
	cursor : pointer;
	background-repeat:no-repeat;
}
#myBtn1 {
	background-image : url('../images/common/footer_mark1.png');
	width : 115px;
	height : 55px;
	float : left;
	margin-right : 20px;
	cursor : pointer;
	text-indent : -99999px;
	background-repeat:no-repeat;
}

#myBtn1:hover {
	background-image : url('../images/common/footer_mark1_on.png');
	width : 115px;
	height : 55px;
	float : left;
	cursor : pointer;
	background-repeat:no-repeat;
}

dfn {font-style : italic;}
mark {background : #ff0;color : #000;}
small {font-size : 80%;}
sub, sup {font-size : 75%;line-height : 0;position : relative;vertical-align : baseline;}
sub {bottom : -0.25em;}
sup {top : -0.5em;}
figure {margin : 1em 40px;}
img {border-style : none;}
svg:not(:root) {overflow : hidden;}
code, kbd, pre, samp {font-family : monospace, monospace;font-size : 1em;}
hr {box-sizing : content-box;height : 0;overflow : visible;}
button, input, select, textarea {font : inherit;margin : 0;}
optgroup {font-weight : bold;}
button, select {text-transform : none;}
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
	border-style : none;
	padding : 0;
}

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
	outline : 1px dotted ButtonText;
}

fieldset {border : #c0c0c0 solid 1px;margin : 0 2px;padding : 0.35em 0.625em 0.75em;}
legend {color : inherit;display : table;max-width : 100%;padding : 0;white-space : normal;}
textarea {overflow : auto;}

[type="checkbox"], [type="radio"] {padding : 0;}
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height : auto;}
[type="search"] {outline-offset : -2px;}
::-webkit-input-placeholder {color : inherit;opacity : 0.540000021457672119140625;}
::-webkit-file-upload-button {font : inherit;}
.w3-image {max-width : 100%;height : auto;}
.w3-table, .w3-table-all {border-collapse : collapse;border-spacing : 0;width : 100%;display : table;}
.w3-table-all {border : #ccc solid 1px;}
.w3-bordered tr, .w3-table-all tr {border-bottom : 1px solid #ddd;}
.w3-striped tbody tr:nth-child(even) {background-color : #f1f1f1;}
.w3-table-all tr:nth-child(odd) {background-color : #fff;}
.w3-table-all tr:nth-child(even) {background-color : #f1f1f1;}
.w3-hoverable tbody tr:hover, .w3-ul.w3-hoverable li:hover {background-color : #ccc;}
.w3-centered tr th, .w3-centered tr td {text-align : center;}
.w3-table td, .w3-table th, .w3-table-all td, .w3-table-all th {padding : 8px 8px;display : table-cell;text-align : left;vertical-align : top;}
.w3-table th:first-child, .w3-table td:first-child, .w3-table-all th:first-child, .w3-table-all td:first-child {padding-left : 16px;}
.w3-btn, .w3-button {
	border : none;
	display : inline-block;
	outline : 0;
	padding : 8px 16px;
	vertical-align : middle;
	overflow : hidden;
	text-decoration : none;
	color : inherit;
	background-color : inherit;
	text-align : center;
	cursor : pointer;
	white-space : nowrap;
}

.w3-btn:hover {box-shadow : 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
.w3-btn, .w3-button {user-select : none;}
.w3-disabled, .w3-btn:disabled, .w3-button:disabled {cursor : not-allowed;opacity : 0.300000011920928955078125;}
.w3-disabled *, :disabled * {pointer-events : none;}
.w3-btn.w3-disabled:hover, .w3-btn:disabled:hover {box-shadow : none;}
.w3-badge, .w3-tag {
	background-color : #000;
	color : #fff;
	display : inline-block;
	padding-left : 8px;
	padding-right : 8px;
	text-align : center;
}

.w3-badge {border-radius : 50%;}
.w3-ul {list-style-type : none;padding : 0;margin : 0;}
.w3-ul li {padding : 8px 16px;border-bottom : 1px solid #ddd;}
.w3-ul li:last-child {border-bottom : none;}
.w3-tooltip, .w3-display-container {position : relative;}
.w3-tooltip .w3-text {display : none;}
.w3-tooltip:hover .w3-text {display : inline-block;}
.w3-ripple:active {opacity : 0.5;}
.w3-ripple {transition : opacity 0s;}
.w3-input {padding : 8px;display : block;border : none;border-bottom : 1px solid #ccc;width : 100%;}
.w3-select {padding : 9px 0;width : 100%;border : none;border-bottom : 1px solid #ccc;}
.w3-dropdown-click, .w3-dropdown-hover {position : relative;display : inline-block;	cursor : pointer;}
.w3-dropdown-hover:hover .w3-dropdown-content {display : block;z-index : 1;}
.w3-dropdown-hover:first-child, .w3-dropdown-click:hover {background-color : #ccc;color : #000;}
.w3-dropdown-hover:hover > .w3-button:first-child, .w3-dropdown-click:hover > .w3-button:first-child {background-color : #ccc;color : #000;}
.w3-dropdown-content {
	cursor : auto;
	color : #000;
	background-color : #fff;
	display : none;
	position : absolute;
	min-width : 160px;
	margin : 0;
	padding : 0;
}

.w3-check, .w3-radio {width : 17px;height : 17px;position : relative;top : 4px;}
.w3-radio2 {width : 125px;height : 129px;background-image : url('../images/01_3_2/s1_3_x.png');border : 0;vertical-align : middle;}

#wrap{width:1120px;height:720px;background-image:url('../images/common/common_bg.png') ;overflow:hidden !important}

/* header */
header{position:relative;width:100%;height:82px;}
header p.course_title{padding-top:45px;}
header p.course_title:after{display:block;content:'';clear:both;}
header .lession_tit_num{color:#fff;font-weight:bold;font-size:23px;float:left;text-indent:10px;}
header .lession_tit_tit{float:left;text-indent:30px;font-weight:bold;font-size:23px;}
header span.lession_tit1{color:#ff8a00;}
header span.lession_tit2{color:#ffbe72;}

/* nav ( 좌측 navigation )  */
nav{position:relative;width:180px;float:left;height:583px;}
nav .nav_box{position:relative;width:90%;min-height:470px;margin:0 auto;z-index:2}
nav ul.ul_box {padding-top:50px;}
nav ul li {float:left;width:100%;font-size:16px;}
nav ul li.last li:last-child {float:left;width:100%;border-bottom:none}
nav ul li.nav_ti .tt1{float:left;width:100%;background-image:url('../images/common/nav_li_bg.png');background-repeat:repeat-x;text-align:left;color:#fff;line-height:29px;font-weight:bold;padding-left:15px;box-sizing:border-box;}
nav ul li.nav_ti .tt2{float:left;width:100%;background-image:url('../images/common/nav_li_bg.png');background-repeat:repeat-x;text-align:left;color:#fff;line-height:29px;font-weight:bold;padding-left:15px;box-sizing:border-box;}
nav ul li.nav_ti .tt3{float:left;width:100%;background-image:url('../images/common/nav_li_bg.png');background-repeat:repeat-x;text-align:left;color:#fff;line-height:29px;font-weight:bold;padding-left:15px;box-sizing:border-box;}
nav ul li.nav_ti .tt4{float:left;width:100%;background-image:url('../images/common/nav_li_bg.png');background-repeat:repeat-x;text-align:left;color:#fff;line-height:29px;font-weight:bold;padding-left:15px;box-sizing:border-box;}
nav ul li.nav_sub a{font-weight:bold;border-bottom:1px solid #50baeb;box-sizing:border-box;float:left;width:100%;color:#7a929c;text-align:left;line-height:33px;background:none; background-image: url(../images/common/bullet.png); background-repeat: no-repeat;background-position:10px center;padding-left:25px;}
nav ul li.nav_quiz a{float:left;width:100%;background-image:url('../images/common/nav_li_quiz_bg.png');background-repeat:repeat-x;text-align:left;color:#fff;line-height:29px;font-weight:bold;margin-bottom:4px}
.thissection{background-image:url('../images/common/nav_li_quiz_bg.png') !important;}


/* 현재 페이지 */
.this_page{color:#0086cc;background-image: url('../images/common/bullet_on.png'); background-repeat: no-repeat;background-position: 10px 3px;padding-left:25px;margin-left:-25px;}
/* 현재 페이지 */


/* footer*/
footer{position:relative;float:left;width:100%;height:55px;}
footer .mark5{float:left;margin-left:640px}
footer .mark5 img{margin-right:5px;margin-left:5px;vertical-align:middle}
footer .pages{float:right;;line-height:55px;height:55px;font-size:22px;font-weight:bold;display:table;color:#576668;}
footer .pages img{margin:0 15px;vertical-align:middle}
footer .pages .now_page{color:#e95800;}

/* 모달팝업 */ 
.modal {display: none;position: absolute;z-index: 1;left: 0; top: 0;width: 1120px; height: 720px; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.6); z-index:9999}
.modal1 {display: none;position: absolute;z-index: 1;padding-top: 20px;left: 0; top: 0;width: 1120px; height: 700px; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.6); z-index:9999}
.modal2 {display: none;position: absolute;z-index: 1;padding-top: 50px;left: 0; top: 0;width: 1120px; height: 700px; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.6); z-index:9999}
.modals {display: none;position: absolute;z-index: 1;left: 0; top: 0;width: 1120px;height: 100%;  overflow: auto;background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.6); z-index:9999}
.modal_mo {
	display : none;
	position : absolute;
	z-index : 1;
	left : 50%;
	top : 50%;
	width : 1120px;
	height : 720px;
	overflow : auto;
	transform : translate(-50%,-50%);
	padding-top : 100px;
	background-color : rgb(0, 0, 0);
	background-color : rgba(0, 0, 0, 0.6);
	z-index : 9999;
}

.modal-content {
	position:relative;
	background-color: #fefefe;
	margin: auto;
	padding: 20px;
	border: 1px solid #888;
	width:auto;
	max-width:80%;
}

.modal-content1 {
	position:relative;
	background-color: #fefefe;
	margin: auto;padding: 20px;
	border: 1px solid #888;
	width:auto;
	max-width:80%;
}

.modal-content3 {
    position: absolute;
    top:50%; left:50%; transform: translate(-50%,-50%);
    width:929px; height:607px;
    background-image: url(../images/map/LearningMapbg.png);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 10;
}

.modal-content_mo {
	position : relative;
	margin : auto;
	width : 929px;
	height : 607px;
	background-image : url('../images/monitor/monitor_bg.png');
	background-repeat : no-repeat;
	box-sizing : border-box;
}

.modal-contents {
	position:relative;
	background-color: none !important;
	margin: auto;
	top:50%;
	margin-top:-91px;
	width: 397px;
	height: 163px;
}

.close, .close_mo {color: #aaaaaa;float: right;display:inline-block;font-weight: bold;position:relative;z-index:99;right:6px;top:6px;width:28px;height:28px;background-image:url('../images/common/close_btn.png');background-repeat:no-repeat;cursor: pointer;}
.close:hover, .close_mo:hover .close:focus, .close_mo:focus {color: #000;text-decoration: none; cursor: pointer;z-index:99}
.close2 {color: #aaaaaa;float: right;font-size: 28px;display:inline-block;font-weight: bold;z-index:99;position:absolute;cursor:pointer;right:10px;top:10px;width:25px;height:25px;background-image:url('../images/common/popup_close_btn.png');background-repeat:no-repeat;}
#moduel_map{position:relative;width:100%;height:100%;display:inline-block;float:left}
/* 모달팝업 */ 

#wrap2 {
	position : relative;
	width : 100%;
	height : 100%;
	background : #fff;
}
#wrap2 h1 {display : none;}
#titles {position : relative;width : 100%;height : 41px;}
#titles h2 {float : left;margin-left : 10px;}
#titles h2 img {vertical-align : middle;}
.close_btn {float : right;margin-right : 10px;margin-top : 10px;}

div.mo_txtbox{position:relative;}
div.mo_txtbox p{font-size:23px;font-weight:bold;color:#00ff18;text-shadow:0 0 0 5px #005a02;}
div.mo_txtbox p.mo_t1{position:absolute;top:15px;left:290px;}
div.mo_txtbox p.mo_t2{position:absolute;top:45px;left:535px;}
div.mo_txtbox p.mo_t3{position:absolute;top:310px;left:50px;text-align:center;}
div.mo_txtbox p.mo_t4{position:absolute;top:118px;left:250px;}
div.mo_txtbox p.mo_t5{position:absolute;top:476px;left:410px;}
div.mo_txtbox p.mo_t6{position:absolute;top:410px;right:190px;text-align:center;}
div.mo_txtbox p.mo_t7{position:absolute;top:532px;right:10px;}
div.mo_txtbox p.mo_t8{position:absolute;top:410px;right:35px;text-align:center;}

article#module_list {
	position : relative;
	width : 97%;
	border : #d2d2d2 solid 2px;
	border-radius : 5px 5px;
	margin : 0 auto;
	padding-bottom : 1%;
	padding-top : 1%;
	padding-left : 1%;
	padding-right : 1%;
	background-color : #fff;
}
article#module_list table {width : 100%;margin-top : 0;}
article#module_list table th {
	background-color : #1797b5;
	color : #fff;
	font-size : 20px;
	width : 20%;
	margin-top : 7px;
}

article#module_list table td {
	background-color : #fff;
	width : 100%;
	display : inline-block;
}

article#module_list table td.first {margin-top : 0;}
article#module_list table td a {
	display : block;
	background-color : #e2e2e2;
	margin-left : 1%;
	line-height : 25px;
	padding : 5px 5px;
	text-indent : 17px;
	width : auto;
	color : #000;
	font-size : 15px;
	font-weight : bold;
}

article#module_list table td.on a {
	display : block;
	background-color : #a8d2e8;
	margin-left : 1%;
	line-height : 25px;
	padding : 5px 5px;
	text-indent : 17px;
	width : auto;
	color : #000;
	font-size : 15px;
	font-weight : bold;
}
article#list_map {
	position : relative;
	width : 97%;
	border : #d2d2d2 solid 2px;
	border-radius : 5px 5px;
	margin : 0 auto;
	padding-bottom : 1%;
	padding-top : 1%;
	padding-left : 1%;
	padding-right : 1%;
	background-color : #fff;
}
article#list_map table {width : 100%;}
article#list_map table th {background-color : #1797b5;color : #fff;height : 30px;}
article#list_map table td {background-color : #e2e2e2;height : 30px;text-indent : 17px;color : #000;}
article#list_map table td.on {background-color : #a8d2e8;}
article#Reference {
	position : relative;
	width : 97%;
	border : #d2d2d2 solid 2px;
	border-radius : 5px 5px;
	margin : 0 auto;
	padding-bottom : 1%;
	padding-top : 1%;
	padding-left : 1%;
	padding-right : 1%;
	background-color : #fff;
}
article#Reference ul {position : relative;height : auto;margin-bottom : 20px;}
article#Reference ul li {float : left;width : 100%;position : relative;line-height : 200%;text-indent : 25px;font-size : 17px;}
article#Reference ul li#Topic {
	background-color : #a8d2e8;
	line-height : 29px;
	font-size : 15px;
	text-indent : 10px;
	font-weight : bold;
}

article#Reference ul li.ref_list {margin-top : 20px;}
article#professor_list {
	position : relative;
	width : 97%;
	border : #d2d2d2 solid 2px;
	border-radius : 5px 5px;
	margin : 0 auto;
	background-color : #fff;
	height : 350px;
}

article#professor_list .professor_pic {
	width : 259px;
	height : 350px;
	float : left;
	margin : 0;
	padding : 0;
}

article#professor_list .professor_info_list {
	width : 480px;
	height : 350px;
	float : left;
	margin : 0;
	padding : 0;
	margin-left : 30px;
}
article#professor_list ul {float : left;width : 100%;margin-top : 20px;}
article#professor_list ul li {
	float : left;
	width : 100%;
	height : 37px;
	background-image : url('../images/intro/professor_dot.png');
	background-repeat : no-repeat;
	background-position : left center;
	border-bottom : 1px solid #e9e9e9;
	text-indent : 25px;
	line-height : 37px;
	font-weight : bold;
	font-size : 15px;
}

article#professor_list ul li a {color : #000;}
video::-internal-media-controls-download-button {display : none;}
video::-webkit-media-controls-enclosure {overflow : hidden;}
video::-webkit-media-controls-panel {width : calc(100% + 30px);}
.modal-content3 h2 {
	text-align:center;
	text-indent:60px;
	height:40px;
}

div.chart:after {display : block;content : '';clear : both;}
div.chart table {border-spacing : 0;border-collapse : collapse;vertical-align : middle;}

.audio{height:30px !important;width:120px !important;bottom:12px;right:330px;position:absolute;opacity:0.7;border-radius:25px;min-height:30px !important;max-height:30px !important;}
span.dpb{display:block;}

div.chart table{margin-top:4px;font-weight:bold;list-style:none;margin-left:43px;}
div.chart table tr{font-size:20px;line-height:36px;}
div.chart table tr td.num{text-align:center;margin-left:8px;width:51px;}
div.chart table tr td.txt{text-align:left;padding-left:20px;width:400px;}
div.chart table tr.c_on td.num{color:#fff;}
div.chart table tr.c_on td.txt{color:#00872e;}
div.chart table tr.c_off td.num{color:#fff;}
div.chart table tr.c_off td.txt{color:#b7b7b7;}
div.chart table tr.c_off td.test, div.chart table tr.c_on td.test{color:#0998de;}

div#modal_con_in_1 h2{padding-left:30px;margin:0 auto;width:94px;height:40px;}

/* 나레이션 버튼 */
button#naBtn {
	background-image : url('../images/common/naBt.png');
	border:0;
	width:33px;
	height:33px;
	margin-left:10px;
	vertical-align:middle;
	cursor:pointer;
}