<style>
@charset "UTF-8";
/* CSS Document */

/* Color scheme hexadecimal values: 
#E0F2F7 light blue TO #bfe7fc (previously #acf0f2)
#DF3A01 red TO #EB7F00 dark orange
#f0f8ff lighter blue to #bfe7fc
#6b8e23 light green to #225378 dark blue
#006400 green to #225378 my

***Colors used for this site: #225378 #1695A3 #bfe7fc #F0F3F4 #EB7F00 */

@font-face {
    font-family: 'neoretrodrawregular';
    src: url('fonts/neord/NEORD___-webfont.eot');
    src: url('fonts/neord/NEORD___-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/neord/NEORD___-webfont.woff') format('woff'),
         url('fonts/neord/NEORD___-webfont.ttf') format('truetype'),
         url('fonts/neord/NEORD___-webfont.svg#neoretrodrawregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'fontleroybrownregular';
    src: url('fonts/leroy/FontleroyBrown-webfont.eot');
    src: url('fonts/leroy/FontleroyBrown-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/leroy/FontleroyBrown-webfont.woff') format('woff'),
         url('fonts/leroy/FontleroyBrown-webfont.ttf') format('truetype'),
         url('fonts/leroy/FontleroyBrown-webfont.svg#fontleroybrownregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face{ 
	font-family: 'journalregular';
    src: url('fonts/journal/journal-webfont.eot');
    src: url('fonts/journal/journal-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/journal/journal-webfont.woff') format('woff'),
         url('fonts/journal/journal-webfont.ttf') format('truetype'),
         url('fonts/journal/journal-webfont.svg#journalregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*
body {
background-image:url('../images/book_ai3.png');
background-repeat:no-repeat;
background-position:center top;
}
*/


#wrapper {
width: 1000px;
margin-left:auto;
margin-right: auto;
/*opacity:0.9;*/
}

/* Top part of the site: logo, nav, signup  */
#top{
width: 995px;
height:60px;
}


#nav{
width:995px;
height:80px;
float:right;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 18px;
}

/*start of navigation*/
ul#navigation li{
float:right;
margin-right:30px;
margin-top:-10px;
position:relative;
list-style-type:none;
}

ul#navigation li a{

}	
	
ul#navigation li a:hover{
color: #EB7F00;
}
/*
#signup{
width:120px;
height:60px;
float:right;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 14px;
}
*/

/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
 
    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
}


/*end Top part of the site: logo, nav, signup  */

#banner{
float:clear;
width: 995px;
height: 400px;
border: 1px solid #225378;
}

/*** banner slideshow set the width and height to match your images **/
#slideshow {
    position:relative;
    height:400px;
	width: 995px;
	border: 1px solid #225378;
	margin-top: -20px;
	background-image:url('../images/banner_frame2.gif');/*** original: banner_frame.png***/
	background-repeat:no-repeat;
	background-position:center;
}

.slide IMG {
    position:absolute;
    top:50;
    left:650;
    z-index:8;
    opacity:0.0;
}

.slide IMG.active {
    z-index:10;
    opacity:1.0;
}

.slide IMG.last-active {
    z-index:9;
}
.icon IMG {
    position:relative;
    top:320;
    left:420;
}
#slideshow p {
    position:absolute;
	z-index:20;
    top:120;
    left:430;
	font-size:120%;
	font-weight:bold;
	line-height:95%;
	font-family:맑은 고딕,   Arial, Helvetica, sans-serif; 
}
/*** end of banner slideshow **/



/*with heigh*/
#main_body{
padding-top:5px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
margin-top: -20px;
float:clear;
font-family:맑은 고딕,   Arial, Helvetica, sans-serif; 
font-size: 18px;
width: 955px;
height: 1200px;
border: 1px solid #225378;
background-color:#bfe7fc;
background-image:url('../images/be_logo_80.png');
background-repeat:no-repeat;
background-position:center;
}

/*without heigh*/
#main_user_class{
padding-top:5px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
margin-top: -20px;
float:clear;
font-family:맑은 고딕,   Arial, Helvetica, sans-serif; 
font-size: 18px;
width: 955px;
border: 1px solid #225378;
background-color:#bfe7fc;
background-image:url('../images/be_logo_80.png');
background-repeat:no-repeat;
background-position:center;
}
#main_body table tr td{
font-size: 16px;
}

/*without heigh*/
#main_aboutus{
margin-left:-100px;
position: relative;  /*for IE, to make negative margin work*/ 
padding-top:5px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
margin-top: -20px;
float:clear;
font-family:Arial, Helvetica, sans-serif; 
font-size: 18px;
width: 1155px;
border: 1px solid #225378;
background-color:#bfe7fc;
background-image:url('../images/be_logo_80.png');
background-repeat:no-repeat;
background-position:center;
}
#main_aboutus table{ 
table-layout:fixed; 
word-break: break-all; /*** without word-break, long url takes whole line space. ***/
}
#main_aboutus table tr td{
font-size: 16px;
}

/*without heigh*/
#class_summary{
margin-left:-100px;
position: relative;  /*for IE, to make negative margin work*/ 
padding-top:5px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
margin-top: -20px;
float:clear;
font-family:Arial, Helvetica, sans-serif; 
font-size: 18px;
width: 1155px;
border: 1px solid #225378;
background-color:#bfe7fc;
background-image:url('../images/be_logo_80.png');
background-repeat:no-repeat;
background-position:center;
}

#class_summary table tr td{ 
font-size: 16px; 
word-break: break-all; /*** without word-break, long url takes whole line space. ***/
}

/*with heigh, no padding-bottom*/
#uc_summary{
padding-top:5px;
padding-left:20px;
padding-right:20px;
margin-top: -20px;
float:clear;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 16px;
width: 955px;
height: 750px;
border: 1px solid #225378;
background-color:#bfe7fc;
background-image:url('../images/be_logo_80.png');
background-repeat:no-repeat;
background-position:center;
}

/*My Page start*/
.my_page{
padding-top:5px;
margin-top: -20px;
float:clear;
width: 995px;
height: 400px;
border: 1px solid #225378;
background-color:#bfe7fc;
font-family:Verdana, Helvetica, sans-serif;


 /* IE10 Consumer Preview 
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #bfe7fc 100%); */

/* Mozilla Firefox 
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #bfe7fc 100%);*/ 

/* Opera 
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #bfe7fc 100%);*/ 

/* Webkit (Safari/Chrome 10) 
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #bfe7fc));*/ 

/* Webkit (Chrome 11+)  
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #bfe7fc 100%);*/

/* W3C Markup, IE10 Release Preview 
background-image: linear-gradient(to top, #FFFFFF 0%, #bfe7fc 100%);*/ 
 
 
} 

.my_page_list{
padding-top:10px;
margin-left:400px;
line-height:40px;
font-size: 20px;
font-family:Verdana, Helvetica, sans-serif;
}

.my_page table tr {
font-size: 18px;
}
/* Community */
.community{
width: 995px;
height: 850px;
margin-top: -20px;
border: 1px solid #225378;
background-color:#bfe7fc;

/*background: -moz-linear-gradient(left, #bfe7fc 0%, white 100%); 
background: -webkit-linear-gradient(left, #bfe7fc 0%, white 100%); 
background: -o-linear-gradient(left, #bfe7fc 0%, white 100%); 
background: -ms-linear-gradient(left, #bfe7fc 0%, white 100%); 
background: linear-gradient(to right, #bfe7fc 0%, white 100%);
*/
}
.comm_list{
float:left;
padding-left:10px;
padding-right:10px;
width: 280px;
height: 800px;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif;
font-size: 24px;
color: #225378;
font-weight:bold;
}
.comm_list_line{
margin-bottom: 15px;
margin-top: 15px;
border-bottom: 1px dotted #225378;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 16px;
}
.comm_list_subline {
margin-left: 30px;
margin-bottom: 10px;
margin-top: 10px;
font-size: 14px;
line-height:20px;
}
.main_body_comm{
float:left;
margin-left:20px;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 14px;
width: 650px;
height: 800px;
}
.main_body_comm table tr{
line-height:30px;
font-size: 14px;
}

.comm_end{
clear:left;
}

.main_body_comm_detail{
padding-left:20px;
padding-right:20px;
margin-top: -20px;
float:clear;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 16px;
width: 955px;
height: 750px;
border: 1px solid #225378;
background-color:#bfe7fc;
}

.comm_title{
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 18px;
color: #EB7F00;
font-weight:bold;
}
/*same as main_body_comm_detail but no height*/
.main_body_material{
padding-left:20px;
padding-right:20px;
margin-top: -20px;
float:clear;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 16px;
width: 955px;
border: 1px solid #225378;
background-color:#bfe7fc;
}
/*end Community*/

/*Winter Camp*/
.winter_camp{
/*margin-left:-100px;*/
position: relative;  /*for IE, to make negative margin work*/ 
/*padding-left:-20px;*/
padding-right:20px;
margin-top: -20px;
margin-bottom: : 200px;
float:clear;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
font-size: 16px;
width: 955px;
border: 1px solid #225378;
background-color:#bfe7fc;
text-align: center;
}


.image{
   width: 600px;
   padding:20px;
   text-align: center;
   float:right;
}
#gallery{
}
#gallery img {
	border: 1px solid #225378;
    width: 100px;
}
#photo{
}
#photo img {
margin-top:50px;
border: 1px solid #225378;	
width: 500px;
}


/*end Winter Camp*/
.style2 {
	font-family:맑은 고딕,  Verdana, Helvetica, sans-serif;
	color:#EB7F00 ;
	font-weight: bold;
	font-size: 24px;
}

.valign-top20 {
    position:relative;
    top:-20px;
}

.style2-valign {
    font-family:맑은 고딕,  Verdana, Helvetica, sans-serif;
    color:#EB7F00 ;
    font-weight: bold;
    font-size: 24px;
    position:relative;
    top:-20px;
}
.style3 {
	font-family:맑은 고딕,  Verdana, Helvetica, sans-serif;
	color:#EB7F00 ;
	font-weight: bold;
	font-size: 24px;
}

.style4 {
    padding-left:20px;
    padding-right:20px;
}
.list {
font-family:맑은 고딕,  verdana,geneva,arial,sans-serif;
font-size:14px;	
}

.list_nav{
width: 900px;
text-align:right;
font-family:맑은 고딕,  verdana,geneva,arial,sans-serif;
font-size:14px;
} 
.solid{
font-family:맑은 고딕,  verdana,geneva,arial,sans-serif;
border-bottom: 1px solid rgb(0,0,0);
font-size:16px;	
width: 900px;
text-align:left;
color:#EB7F00;
}

.contents{	
font-family:맑은 고딕,  verdana,geneva,arial,sans-serif;
width: 900px;
text-align:left;
margin-top:5px;
font-size:14px;	
}
.edit{	
font-family:맑은 고딕,  verdana,geneva,arial,sans-serif;
	width: 900px;
	text-align:right;
	margin-top:5px;
	margin-bottom:30px;
	font-size:11px;	
}
.dotted{
font-family:맑은 고딕,  verdana,geneva,arial,sans-serif;
border-bottom: 1px dotted ;
font-size:14px;	
}

/*QnA end*/
#contact{
float:clear;
width: 995px;
height: 400px;
border: 1px solid #225378;
margin-top: -20px;
background-image:url('../images/contact2.jpg');
background-repeat:no-repeat;
background-position:center;
padding-top:50px;
font-family:맑은 고딕,  Lucida Console;
text-align: center;
background-color:#bfe7fc;
line-height: 30px;
}

#contact table tr td{
font-size: 18px;
}

#bottom{
width: 1000px;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
/*height: 260px;
margin-top: 5px;*/
font-size: 18px;
text-align: center;
background-color:#F0F3F4;
}

.bot_section{
margin-right:6px;
margin-bottom:6px;
float: left;
width: 325px;
height: 258px;
border: 1px dotted #225378;
text-align: center;
vertical-align:-25px;
border-radius: 10px;

/*border-right: 1px solid #000;
border-right-style:dotted;
border-bottom: 1px solid #000;
border-bottom-style:dotted;

background-image:url('../images/note2.jpg');
background-repeat:no-repeat;
background-position:20px;
background-color:#F0F3F4;*/
}


#footer{
margin-top: 5px;
float: clear;
width:100%;
height:140;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
text-align: center;
line-height: 20px;
vertical-align:middle;
font-size: 14px;
background-color:#F0F3F4;

/* IE10 Consumer Preview  
background-image: -ms-linear-gradient(bottom, #bfe7fc 0%, #FFFFFF 100%);*/
/* Mozilla Firefox  
background-image: -moz-linear-gradient(bottom, #bfe7fc 0%, #FFFFFF 100%);*/
/* Opera  
background-image: -o-linear-gradient(bottom, #bfe7fc 0%, #FFFFFF 100%);*/
/* Webkit (Safari/Chrome 10) 
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #bfe7fc), color-stop(1, #FFFFFF));*/ 
/* Webkit (Chrome 11+)  
background-image: -webkit-linear-gradient(bottom, #bfe7fc 0%, #FFFFFF 100%);*/
/* W3C Markup, IE10 Release Preview 
background-image: linear-gradient(to top, #bfe7fc 0%, #FFFFFF 100%);*/ 
}

#logo{
margin-bottom:10px;
}


/*pagination*/
.pagination {
width: 790px;
	margin-right: auto;
	margin-left: auto;
}

.pagination a {
	padding: 2px 5px 2px 5px;
	margin: 2px;
	border: 1px solid #AAAADD;
	
	text-decoration: none; /* no underline */
	color: #000099;
}
.pagination a:hover, div.pagination a:active {
	border: 1px solid #000099;

	color: #000;
}
.pagination span.current {
	padding: 2px 5px 2px 5px;
	margin: 2px;
		border: 1px solid #000099;
		
		font-weight: bold;
		background-color: #000099;
		color: #FFF;
	}
	.pagination span.disabled {
		padding: 2px 5px 2px 5px;
		margin: 2px;
		border: 1px solid #EEE;
	
		color: #DDD;
	}

.clear{
float:clear;
}
.table-border 
{
border-collapse:collapse;
}
.height-30{
line-height: 30px;
}
.height-20{
line-height: 20px;
}
/* font */
.font{
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
}

.font_message{
font-size: 24px;
font-family:맑은 고딕,  Arial, Helvetica, sans-serif; 
margin-left: -200px;
}

.font_12{
font-size: 12px;
}
.font_b12{
font-size: 12px;
font-weight:bold;
}
.font_14{
font-size: 14px;
}
.font_14b{
font-size: 14px;
font-weight: bold;
}
.font_16{
font-size: 16px;
}
.font_20{
font-size: 20px;
}
.font_bold{
font-weight:bold;
}
.font_thicker{
font-weight:900;
}

/* color */
.red{
color:#ff0000;
}
.red a{
color:#ff0000;
}
.blue{
color:#0000ff;
}
.blue14{
color:#0000ff;
font-size: 14px;
}
/* margin */
.margin-top_-10{
margin-top: -10px;
}
.margin-top_-15{
margin-top: -15px;
}
.margin-top_-20{
margin-top: -20px;
}
.margin-top_6{
margin-top: 6px;
}
.margin-top_10{
margin-top: 10px;
}
.margin-top_15{
margin-top: 15px;
}
.margin-top_20{
margin-top: 20px;
}
.margin-top_-20{
margin-top: -20px;
background-color:#bfe7fc;
}
.margin-top_30{
margin-top: 30px;
}
.margin-top_40{
margin-top: 40px;
}
.margin-top_50{
margin-top: 50px;
}
.margin-top_60{
margin-top: 60px;
}
.margin-top_20{
margin-top: 20px;
}
.margin-top_50{
margin-top: 50px;
}
.margin-top_70{
margin-top: 70px;
}
.margin-top_80{
margin-top: 80px;
}
.margin-top_90{
margin-top: 90px;
}
.margin-top_100{
margin-top: 100px;
}
.margin-top_110{
margin-top: 110px;
}
.margin-top_300{
margin-top: 300px;
}
.margin-top_400{
margin-top: 400px;
}
.margin-bottom_100{
margin-bottom: 100px;
}
.margin-bottom_20{
margin-bottom: 20px;
}
.margin-left_5{
margin-left: 5px;
}
.margin-left_10{
margin-left: 10px;
}
.margin-left_20{
margin-left: 20px;
}
.margin-left_30{
margin-left: 30px;
}
.margin-left_40{
margin-left: 40px;
}
.margin-left_60{
margin-left: 60px;
}
.margin-left_57{
margin-left: 57px;
}
.margin-left_90{
margin-left: 90px;
}
.margin-left_95{
margin-left: 95px;
}
.margin-left_110{
margin-left: 110px;
}
.margin-left_200{
margin-left: 200px;
}

.margin-left_140{
margin-left: 140px;
}
.margin-left_147{
margin-left: 147px;
}


.margin-right_5{
margin-right: 5px;
}
.margin-right_40{
margin-right: 40px;
}
.margin-right_60{
margin-right: 60px;
}
.padding-top_60{
padding-top: 60px;
}
.line-height_30{
line-height:50px;
}
.valign{
vertical-align:-50px;
}
a{
color: #225378;
font-weight:bold;
text-decoration: none;
}
a:hover
 { 
color: #EB7F00;
text-decoration: none;
 } 
 a:active
 { 
text-decoration: none;
 } 
.float-r{
float: right;
} 
.text-align-c{
text-align:center;
}
input.sp_button {
    width: 20em;  height: 2em;
}
</style>