@import url("font/fonts.css");

/*Common*/

body, button { font-family:  'Malgun Gothic', 'Droid Sans', 'Droid Sans Fallback', sans-serif;  font-size: 17px; color: #333;}
.clear { clear: both; }

img { vertical-align: middle  ; }

/*Layout*/

#bodyWrap { width:1200px; margin: 0 auto; position: relative;  }

header { padding: 10px 0 10px; border-bottom: 2px solid #ddd; height: 50px; }
header h1 { display: block; width:260px; height: 50px; overflow: hidden; text-indent: -9999px; background: url(images/logo.png) 10px top no-repeat; float: left; padding-bottom: 10px;  border-bottom:2px solid #D80546;    }
header h1 a { display: block; width:260px; height: 50px; cursor: pointer;  }

.searchWrap { float: right; height: 50px;   }
.searchResult { float: right; height: 50px; }
#search { float: left; background-image: url(images/search.png); background-repeat: no-repeat; background-position: left top; }
#search:hover  { background-position: left -50px; }
#search .searchBar { display: block; float: left;  background: transparent;    height: 20px; padding: 15px 0 5px 35px; border:none;  width:125px; color: #333; outline: none; margin-bottom: 10px;}


 

#search .searchBtn { float: right;   background: url(images/btn_search.png) left top no-repeat; display: block; border:none; height: 50px; margin: 0; padding: 0; padding-left: 30px;  } 
#search .searchBtn  span { display:block;  background: url(images/btn_search.png) right top no-repeat;   padding-right: 30px; height: 50px; line-height: 50px; margin: 0; text-shadow: 1px 1px 0px #fff; color: #333; font-size: 16px;   font-weight: bold;  }
#search .searchBtn:hover { background-position: left  bottom;  }
#search .searchBtn:hover span { background-position: right  bottom;  text-shadow: 1px 1px 0px #333; color: #fff;  }


.sitemapBtn {  width: 45px; height: 50px; display: block; overflow: hidden; text-indent: -9999px; float: right; margin-left: 5px; background-position: top;  background-image: url(images/btn_sitemap.png);  }
.sitemapBtn:hover { background-position: bottom; }

nav { float: left;  margin: 20px 0 40px; width:258px; border:1px solid #bdbdbd; }
nav ul {   }
nav ul li { display: block;  border-bottom:1px solid #ddd;}
nav ul li a { display: block; padding: 10px 10px 10px 14px;  background: url(images/nav_bg.png) top repeat-x; line-height: 30px;  text-decoration: none; color: #6d6e70; font-size: 1.1em; font-weight: bold;  overflow: hidden; }
nav ul li a:hover {   border-left:5px solid  #6d6e70; color: #D80546; font-weight: bold; padding-left: 10px; }
nav ul li.on a:hover, nav ul li.on a {   border-left:5px solid  #D80546; color: #D80546; font-weight: bold; padding-left: 10px; }
 
nav ul li ul {  display: none; padding: 0;}
nav ul li.on ul { display: block;  border-bottom: 1px solid #ccc;  background: #fff; }
nav ul li.on ul li { border-top:1px solid #ccc; font-weight: bold; border-bottom: none;  }
nav ul li.on ul li a { color: #333; font-weight: normal; background: none; border:none; padding: 10px 10px 10px 25px;  line-height: 20px; font-size: 1em;   }
nav ul li.on ul li a:hover { border:none; padding-left: 25px; font-weight: bold;   background: url(images/arrow_gray_s.png) 5px center no-repeat;  }
nav ul li.on ul li.on a:hover, nav ul li.on ul li.on a { font-weight: bold;   background: url(images/arrow_red_s.png) 5px center no-repeat;  }
 

.contentsWrap { float: right; width: 880px; padding: 0px 10px 50px; position: relative;}

footer { clear: both; padding-top: 15px; height: 25px;  border-top:2px solid #ddd; }
footer .version { float: left;  font-size: 11px; color: #999;     }
footer span { display: block; float: right;  font-size: 12px; color: #666;     }

 
 

 
/*Content*/

.indexNoti {margin-top:20px; padding:25px 0 0;    font-weight:bold;  position: absolute; bottom:15px; border-radius: 5px; width:880px; background: #fff;}
.indexNoti  h3 { background:  color:#D80546; position: absolute; line-height: 20px; display: block; left:0; top:-14px; font-size: 0.8em; color: #D80546; border:1px solid #ddd; background: #eee; padding: 3px 10px; border-radius: 3px; }
.indexNoti ul {    } 
.indexNoti ul li {   line-height:20px; color:#999; font-size:0.8em; list-style:disc; margin-left: 20px;    } 



section h2 { font-size: 1.6em;  margin: 3px 0 30px 10px; padding: 0 20px 0px 20px;  line-height: 140%; background: url(images/nav_on.png) repeat-y; color:#222; }
section h2 term.lg{font-weight:bold; }
 
section { clear: both;  padding: 20px 0px 40px 0px;  } 
section a {  color: #333; text-decoration: none; font-weight: bold; }
section a:hover {   color: #D80546; text-decoration: none;  }
section .topBtn { float: right; margin: 10px 0;  padding-left: 35px;  background: url(images/btn_top.png) left top no-repeat; display: block;    }
section .topBtn span { display: block;  background: url(images/btn_top.png) right top no-repeat; padding-right: 20px; height: 34px; line-height: 34px; text-shadow: 1px 1px 0px #fff; color: #333; font-size: 16px; }
section .topBtn:hover { background-position: left  bottom;  }
section .topBtn:hover span { background-position: right  bottom;  text-shadow: 1px 1px 0px #333; color: #fff;  }
section h3 { font-size: 1.6em; margin: 3px 0 30px 0; line-height: 140%; padding-left: 30px; background: url(images/h3_arrow.png) 5px no-repeat;
 }
section h3 span, section h4 span, section h5 span, .remote { color: #D80546; }
section h3 term.lg { font-weight: bold;}
.gray { color: #333 }
section h4 { font-size: 1.3em; padding: 20px 0 20px; margin-left: 30px; margin-top: 15px; border-top:1px dotted #ccc; line-height: 140%;  }
section h4 term.lg{font-weight:bold; }
section h4.under { padding-top: 0; border:none; }
section h5 { font-size: 1.2em; padding: 20px 0 15px 30px; line-height: 140%; }
section h5 term.lg{font-weight:bold; }
section h5.location { font-size: 1.0em; padding-top:0;}
section p { margin:0 0 15px 30px; line-height: 160%; }
section term.osd { font-weight: bold;  display: inline; }
section term.lg { font-weight: normal;}
section img { height: 26px; width: auto; } 

section a:hover term.osd { font-weight: bold;  display: inline; }
section a term.lg {font-weight: bold;}
section a:hover term.lg { font-weight: bold; color:#D80546}

section ul p, section ol p { margin: 0 ;   }
section ul, section ol { margin:10px 0 30px 30px; display: block; position: relative;}
section ul li {padding-left: 35px; margin-bottom: 10px; line-height: 160%; font-weight: bold; }
section ol li {margin-left: 35px; margin-bottom: 10px; line-height: 160%; list-style: decimal; font-weight: bold;}
section ul li p, section ol li p { font-weight: normal; }
section ol li ul li { list-style: none; }
section ul li { background: url(images/bull_circle.png) 10px 4px no-repeat;  }
section ul.h4list li {background: url(images/bull_arrow_g_s.png) 8px 7px no-repeat; }
section ul.h4list li:hover{background: url(images/bull_arrow_r_s.png) 8px 7px no-repeat; }

section ol span, section ul span { color: #D80546; font-weight: bold; }
section li ul, section li ol { padding: 0; margin: 10px 0 0; } 
section li li {    margin: 10px 0 0 5px; padding-left: 20px;  background-image:  url(images/bull_circle_2.png); background-position: left 4px; }
section li ol li { background: none; } 
section li a term.lg{ font-weight: bold;}
section li a:hover term.lg{ font-weight: bold; color: #D80546; }
section li a { font-weight: bold; color: #333; } 
section li a:hover { color: #D80546; text-decoration: none; } 
section li table {   }


section table {  border-top:none; width: 100%; border:2px solid #ccc;  }
section table tr {  }
section table th { padding: 10px; background: url(images/white.png) top repeat-x #f6f4f5; border-top:1px solid #ccc;  border-bottom:1px solid #ccc;
border-right: 1px solid #ccc; color: #555;   text-align: left; vertical-align: middle;  }

section table td {  border-top:1px solid #ccc; border-right: 1px solid #ccc; vertical-align: middle;    padding: 10px; background: url(images/td_bg.png) top repeat-x #fff;  color: #555; }
section table tr th p{ margin:0px;}
section table tr td p{text-align:left; margin:0px;}
section table tr td.center p{text-align:center;}
section table term.osd, section table term.lg { color: #555; }
section table term.remote { color:#D80546;  }
section table ul, section table ol { margin: 0px 0px 0px 5px; padding: 0; }
section table ul li, section table ol li { margin:10px 0 0 0; font-size: 1em;  color: #666; padding-left: 20px; } 
section table ul li {  background-image:  url(images/bull_circle_2.png);   background-position: left 4px;} 
section table .center, section table .center th { text-align: center; vertical-align: middle;}

section p img {position: relative; top:-2px; vertical-align: middle; }
section .coption img.round { display: inline-block; border-radius: 3px; height: 20px; width: auto; vertical-align: top;}

section table.hidden { border:none; width: auto; }
section table.hidden tr {  }
section table.hidden th { background: none; border:none; font-weight: normal; vertical-align: top; text-align: left; padding: 0;}
section table.hidden td	{ border: none; background: no-repeat; padding: 0 0 0 10px; vertical-align: top;  }

section table.centerTitle th { text-align: center;}

.tableWrap { margin: 15px 0 15px; padding-left: 30px;}
li .tableWrap { margin: 15px 0 15px; padding-left: 0px;}
.tableWrap span.caption { display: inline-block; width: 100%; padding: 0 0 10px 0; text-align: center; text-align: center; color: #444;  font-weight: bold;}

section .imgWrap { margin:0 30px 20px; text-align: center; }
section .imgWrap img {  }
section .imgWrap span { display: block;  padding-top:10px; font-weight: bold;}
section .comingWrap { margin-bottom: 40px; text-align: center;}
section .comingWrap span { display:inline-block; padding: 40px  0 40px 60px;  font-weight: bold; background: url(images/coming.png) left no-repeat;  }


section div.caption {  padding:40px 0 5px; margin:20px 0 10px 30px; position: relative;  color: #666;  }
section div.caption a, section div.caption term.osd { color: #666; } 
section div.caption a:hover {   color: #D80546; text-decoration: none;  }
section div.caption term.osd { color: #666; }
section div.caption term.remote { color:#D80546;  }
section div.caption p {margin:10px 0 10px 35px; line-height: 160%;}
section div.caption p.sub { margin-bottom: 10px; font-size: 1em;  color: #666; }
section div.caption .title {  color:#D80546; position: absolute; line-height: 160%; display: block; left:0; top:5px; font-size: 0.8em; color: #FFF; border:1px solid #999; background: url(images/bg_note.png) center; padding: 3px 12px 3px 12px; border-radius: 5px; font-weight: bold; letter-spacing: 0px; } /* padding:À§, ¿ìÃø, ¾Æ·¡, ÁÂÃø */ /*letter-spacing: ÀÚ°£ */
section div.caution .title  { border-color: #D80546; background:  url(images/bg_caution.png) center;  }
section div.tip .icon  { color: #47aa16; background-image: url(images/tip.png);}
section div.caption ul, section .caption ol  { padding: 0; margin: 10px 0 0 30px;  margin-bottom: 10px; padding-left: 0; }

section div.caption ul li { background-image:  url(images/bull_check.png); background-position: 0px 4px; padding-left: 30px; }
section div.caption ol li {   }
section div.caption .tip ol {   padding:5px 0;   padding-left: 0; }
section div.caption li p { margin: 0;  }
section div.caption img { height: 26px; width: auto; } 
 
section table .caption {  margin:15px 0 0px 21px;  }
 
section ul.fit li:first-child { margin-top:0; }

section a:hover term.osd {  color: #D80546 ; text-decoration: none; }

/*Search*/


.searchResultWrap { height: 400px; padding-top:70px;  }

#tipue_search_results_count, #tipue_search_warning_head {  font-size: 1.2em; padding-left: 10px; font-weight: normal; position: absolute; line-height: 40px; top:-60px; }
#tipue_search_results_count span { color: #D80546; font-weight: bold; }



#tipue_search_content { border:1px solid #ddd; padding: 8px; height: 336px; position: relative;  }
#tipue_search_content .list {  padding: 5px 10px ; height: 55px; color: #666; display: block; text-decoration: none; padding-left: 15px; background-color: #f6f4f5; margin-bottom: 3px; }
#tipue_search_content .list #tipue_search_content_title { padding-bottom: 5px; font-size: 1.2em; color: #333;  text-decoration: none; color: #333; font-weight: bold; }
#tipue_search_content .list #tipue_search_content_text { overflow: hidden; line-height: 20px; height: 20px; }
#tipue_search_content .list #tipue_search_content_text em {  color:#D80546; font-style: normal;}
#tipue_search_content a.list:hover { padding-left: 10px; border-left: 5px solid #D80546; background-color: #eee;  }
#tipue_search_content a.list:hover #tipue_search_content_title { color:#D80546;  }
#tipue_search_content a.list:hover #tipue_search_content_text { color: #333;  }

.searchResult .pageNumber { padding: 10px; text-align: right; color: #999; font-size: 1.2em; height: 30px; line-height: 30px; }
.searchResult .pageNumber span { font-weight: bold; color:#D80546;  }
 

.searchController { position: absolute; right: -55px; background: #f6f4f5; display: block; padding: 62px 0; border:1px solid #ddd; opacity: 0.3; border:1px solid #ddd;  }
.searchController span {   width: 50px; height: 50px; display: block; overflow: hidden; text-indent: -9999px; background-position: top;  }
.searchController.on { display: block; opacity: 1.0;  }
.searchController.on:hover {  background-color: #eee;  }
.searchController.prev { top:-1px; }
.searchController.next { bottom:-1px; }
.searchController.prev span { background-image: url(images/prev.png); }
.searchController.next span { background-image: url(images/next.png); } 
.searchController.on:hover span {  background-position: bottom;} 

#tipue_search_foot { position: absolute; bottom:-33px; right:-1px; }
#tipue_search_foot_boxes { float: right; display: block; }
#tipue_search_foot_boxes li { float: left; display: block; padding-left: 2px;}
#tipue_search_foot_boxes li a { float: left; display: block; padding:4px 9px; height:20px; line-height: 20px; border:1px solid #ddd; background: #f6f4f5; color: #666; text-decoration: none; color: #333; }
#tipue_search_foot_boxes li a:hover { background: #D80546; color: #fff; border-color:#D80546;  }
#tipue_search_foot_boxes li.current a, #tipue_search_foot_boxes li.current a:hover {  color: #D80546; border-color: #ddd; background: #f6f4f5; font-weight: bold;}

/*TOC*/

#toc .contentsWrap {height:600px;}
#toc .contentsWrap h2 { font-family: "bryant_proregular", sans-serif;  font-size: 48px; color: #C40452;}
#toc .contentsWrap h2 span { color: #666; }
#toc .contentsWrap .tocTableWrap {}
#toc .contentsWrap .tocTableWrap {clear: both;  }
#toc .contentsWrap .tocTableWrap table{width:100%;}
#toc .contentsWrap .tocTableWrap table tr td.titleContent{padding-top:140px;text-align:center;}
#toc .contentsWrap .tocTableWrap table tr td.titleImg{padding-top:50px;text-align:center;}


.tocWrap {     }
.tocWrap .listWrap {  padding:20px 0 20px; position: relative; clear: both; width:1230px;   }
.tocWrap .listWrap ul { display: block; margin-bottom: 15px;   }
.tocWrap .listWrap ul li { border-top:3px solid #999; float: left; width:275px; display: block; background-position: center top; background-repeat: no-repeat; margin-right: 30px; margin-bottom: 20px; }
.tocWrap .listWrap ul li a { color: #333; }
.tocWrap .listWrap ul li a.depth1 {  display: block; padding: 10px 12px 10px 15px;  background: url(images/nav_bg.png) top repeat-x;  line-height: 30px;  text-decoration: none; color: #666; font-size: 1.1em; font-weight: bold; border-bottom: 1px solid #ddd;   }
.tocWrap .listWrap ul li a.depth1:hover {  border-left:5px solid  #D80546; color: #D80546; font-weight: bold; padding-left: 10px; }
.tocWrap .listWrap ul li ul { padding: 10px 0 10px 0px; }
.tocWrap .listWrap ul li ul li  { clear: both; width:100%;  background: none;   margin: 0; border:none;}
.tocWrap .listWrap ul li ul li a { font-weight: normal; background: none; margin: 0; text-decoration: none; border:none; padding: 5px 10px 5px 25px;   line-height: 20px; font-size: 1em; display: block; }
.tocWrap .listWrap ul li ul li a:hover { font-weight: bold;   background: url(images/arrow_gray_s.png) 5px center no-repeat;} 

 
/**/

section div.trans { color: green !important; }
 
section term.remote { color: #D80546 !important; font-weight:bold; }

.blockimg{margin-left:30px; margin-bottom:15px; }

.blockimg img{width:650px; height:auto; }

/*
section term.osd { color: #00F !important; font-weight:bold;}
section term.lg { color: #008040 !important; font-weight:bold;}
section term.remote { color: #F00 !important; font-weight:bold; }
*/