@font-face { 
	font-family: 'PSL-Kanda';
	src: url('font/PSL-Kanda.eot');
	src: url('font/PSL-Kanda.eot?#iefix') format('embedded-opentype'), 
		 url('font/PSL-Kanda.woff') format('woff'),
		 url('font/PSL-Kanda.ttf') format('truetype'),
		 url('font/PSL-Kanda.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face { 
	font-family: 'PSL-KandaBold';
	src: url('font/PSL-KandaBold.eot');
	src: url("font/PSL-KandaBold.eot?#iefix") format('eot'), 
		 url('font/PSL-KandaBold.woff') format('woff'),
		 url('font/PSL-KandaBold.ttf') format('truetype'),
		 url('font/PSL-KandaBold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face { 
	font-family: 'PSL-Kittithada';
	src: url('font/PSL-Kittithada.eot');
	src: url("font/PSL-Kittithada.eot?#iefix") format('eot'), 
		 url('font/PSL-Kittithada.woff') format('woff'),
		 url('font/PSL-Kittithada.ttf') format('truetype'),
		 url('font/PSL-Kittithada.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face { 
	font-family: 'RSU_Regular';
	src: url('font/RSU_Regular.eot');
	src: url("font/RSU_Regular.eot?#iefix") format('eot'), 
		 url('font/RSU_Regular.woff') format('woff'),
		 url('font/RSU_Regular.ttf') format('truetype'),
		 url('font/RSU_Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face { 
	font-family: 'THSarabunNew';
	src: url('font/THSarabunNew.eot');
	src: url("font/THSarabunNew.eot?#iefix") format('eot'), 
		 url('font/THSarabunNew.woff') format('woff'),
		 url('font/THSarabunNew.ttf') format('truetype'),
		 url('font/THSarabunNew.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}



body {
	font-family: Tahoma, 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 12px;
}


/*
	New Style for Div tag
*/

* { margin: 0; padding: 0; }


img.left { float:left}

img.* {border:0; padding:0;}

img.noborder {
	border:0
}

*.block {display : block;}



#wrapper {
	width: 100%;
	margin : 0 auto;
	padding: 0;
	/*background-color: red;*/
	clear:both;
	/*#DEFAEB white green*/ 
}

#container {
	width: 1265px;
	margin : 0 auto;
	padding: 0;
	/*background-color: red;*/

	/*#DEFAEB* white green*/ 
	
}

#header {
	position : relative;
	margin : 0 auto;
	padding: 0;
	/*background-color: #22396d;*/
	z-index: 40;
		/*#DEFAEB* white green*/ 
}

#navbar {
	clear: both;
	width: 1265px;
	/*height : 33px;*/
	margin : 0 auto;
	padding: 0;
	color: #FFFFFF;
	background-color: #22396d;
	text-align: center;
}

#content {
	clear : both;
	display: block;
	background-color: #FFFFFF;
	
}

#content_oc {
	/*display: block;*/
	background-color: #FFFFFF;
	background-image: url(images/bg.jpg);
	background-repeat: no-repeat;
	
}

#content_slide {
	clear : both;
	float : left;
	margin-top:20px;
	margin-left:170px;
	/*background-color:red;
	border: 1px solid black;*/
	width: 930px;/*455*/
	height: 320px;/*370*/
}

#content_video {
	clear : both;
	//float : left;
	width: 700px;
	margin-left: auto;
	margin-right: auto;
}


#content_search {
	float : left;
	margin-top: 50px;
	margin-left: 20px;
	/*background-color:blue;*/
	width: 455px;
	height: 130px;
	
}



#content_1 {
	float : left;
	margin-top: 5px;
	margin-left:20px;
	/*background-color:blue;*/
	border: 0px solid blue;
	width: 455px;
	height: 210px;
	
}

.line_content1 {
	width: 100%;
	height:6px;
	background-color: #FF6600;
}

#content_2 {
	clear : both;
	float : left;
	margin-top: 20px;
	margin-left: 170px;
	/*background-color: #eeeeee;
	border: 3px solid #000066;*/
	width: 455px;/**/
	height: 530px;
	
}

#content2_menu {
	color : white;
	width: 455px;
	height: 25x;
	/*background-color: #0f77b6;*/
	background-color: #22396d;
}

#content_3 {
	float : left;
	margin-top: 10px;
	margin-left: 20px;
	/*background-color:#eeeeee;*/
	border: 0px solid blue;
	width: 455px;
	height: 210px;
	
}

.line_content3 {
	width : 100%;
	height: 6px;
	background-color: #00AA00;
}

.line_content4 {
	width : 100%;
	height: 6px;
	background-color: #990099;
}

.line_content5 {
	width : 100%;
	height: 6px;
	background-color: #FF0099;
}

.line_content8 {
	width : 100%;
	height: 6px;
	background-color: #1dbfaa;
}

.line_content9 {
	width : 100%;
	height: 6px;
	background-color: #0aade8;
}

#content_4 {
	float : left;
	margin-top: 10px;
	margin-left: 20px;
	/*background-color:#eeeeee;*/
	width: 455px;
	height: 220px;
	
}

#content_5{
	float : left;
	margin-top: 3px;
	margin-left: 20px;
	/*background-color:#eeeeee;*/
	border: 0px solid blue;
	width: 455px;
	height: 130px;
	
}

#content_detail{
	display: block;
	float : left;
	margin-top: 50px;
	margin-left: 200px;
	/*background-color:blue;*/
	width: 800px;
}


#footer {
	clear :both;
	position : relative;
	top: 10 px;
	display:block;
	margin: 0 0 0 0;
	padding: 0;
	background-color:#22396d
	z-index: 1;
}


#policy {
	clear:both;
	width: 100%;
	height: 40px;
	background-color:#22396d;
	color : #FFFFFF;
	text-align: center;
}

#link_web {
	margin-left:auto;
	margin-right:auto;
	width:40%;	
}

#policy a:link {  text-decoration : none; color:#FFF}
#policy  a:visited { text-decoration : none; color:#FFF}
#policy  a:hover { text-decoration : none; color:#0066FF}

#policy  a:hover { text-decoration : none; color:#0066FF}

#content2_menu .menu:hover { text-decoration : none; color:#0066FF; cursor: pointer;}

.div_space {
	clear: both;
	width:100%;
	height:30px;
}

.c { clear: both; }

/*
a{
	font-family: 'PSL-Kanda', Arial, Helvetica, sans-serif ;
	color: white;
	font-size: 22px;
	font-weight:bold;
	
}
*/
img {float:left;}

 .break { display:block; clear:both;}

.login_text {
	font-family: 'PSL-Kanda', Arial, Helvetica, sans-serif ;
	text-decoration: none;
	color: white;
	font-weight:bold;
	font-size: 22px;
	text-align :center;
}

.login_text_new {
	position : absolute;
	top: 0;
	left: 1070px;
	font-family: 'PSL-Kanda', Arial, Helvetica, sans-serif ;
	text-decoration: none;
	color: white;
	font-weight:bold;
	font-size: 22px;
	text-align :left;
}



.MainMenu {
	font-family: 'PSL-Kanda', Arial, Helvetica, sans-serif;
	color: white;
	font-weight: bold;
	font-size: 22px;
	text-align: justify;
	letter-spacing:1px;
}

.menu_fixed {
	position: fixed;
}

.findText {
	font-family: 'PSL-Kanda';
	color: white;
	font-weight:bold;
	font-size: 22px;
}


.topic { 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
}

.topic1 { 
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: bold;
	/*background-color:#FF6600;
	color: #FFFFFF; */
	color: #0f77b6; 
}

.topic2 { 
	font-family:  'PSL-Kanda',  Arial, Helvetica,   sans-serif;
	font-size: 30px;
	font-weight: bold;
	color: #0f77b6;
}

.topic3 { 
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: bold;
	/*color: #00AA00;*/
	color: #0f77b6; 
}

.topic4 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: bold;
	color: #990099;
}


.topic5 { 
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: bold;
	/*color: #FF0099;*/
	color: #0f77b6; 
}

.topic50 { 
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	/*color: #FF0099;*/
	color: #0f77b6; 
}

.title1 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight: bold;
	color: #FF6600;
}


.title2 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight:bold;
	/*color :#0f77b6;*/
	color :#224099;
}
.title3 {
	font-family: 'Thonburi',Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-weight:bold;
	color :#00AA00;
}
.title4 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight:bold;
	color: #990099;
}
.title5 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight:bold;
	color: #FF0099;
}
.title8 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight:bold;
	color: #08199c;
}

.title55 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight:bold;
	color: #FF0099;
}

.title9 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 35px;
	font-weight:bold;
	color: white;
	
}

.title10 {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight:bold;
	color: black;/*#00AA00;*/
}

.detail_text {
	font-family: "Thonburi",Tahoma, Helvetica, sans-serif ;
	font-size: 14px;
	color: black;
}

.policy_text {
	font-family: Tahoma, Helvetica, sans-serif ;
	font-size: 12px;
	color: #FFFFFF;
}


.right {
	float: right;
}

.inline {
	display: inline;
}

.item {
	clear : both;
	position : relative;
}

#search_box{
	background-color: #EAEBED;
	padding: 10px;
}

.padding_top{
	padding-top: 5px;
}


.padding_top10{
	padding-top: 10px;
}

.padding_top20{
	padding-top: 20px;
}


.padding_right{
	padding-right: 10px;
}

.padding_left50{
	padding-left: 50px;
}


.v_center {
	line-height : 60px;
	position : absolute;
	margin-top: auto;
	margin-bottom: auto;
	left: 72px;
	top: 10px;
	width: 268px;
}

.v_center_media {
	line-height : 180px;
	position : absolute;
	margin-top:auto ;
	margin-bottom: auto;
}

/* =================================

		Main Menu CSS 
		
		bgcolor = #22396d
====================================
*/
#cssmenu {
  display : block;
  /*position : relative;*/
  
  height : 33px;
  width: auto;
  /*margin: 0 auto;*/
  margin: 0 0 0 70px; 
  text-align: center;
  background-color: #22396d;
  /*float:right;*/
  
}


#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a {
  padding: 0;
  margin: 0;
  /*font-family: 'PSL-Kanda', Tahoma, Arial, sans-serif;*/
  font-family: "Thonburi",Tahoma, Helvetica, sans-serif ;
  font-weight: bold;
  font-size: 12px;
  line-height:33px;
  color: #ffffff;
  /*
  -webkit-transition: all ease .3s;
  -o-transition: all ease .3s;
  -moz-transition: all ease .3s;
  -ms-transition: all ease .3s;
  transition: all ease .3s;
  */
  text-align : left;
  letter-spacing: 1px;
  background-color: #22396d;
}

#cssmenu ul ul li a {
  /*padding: 0px 10px;*/
  padding: 3px 10px 3px 10px;
  margin: 0px 0px 0px 0px;
  /*font-family: Tahoma,Arial,PSL-Kanda, sans-serif;*/
  font-family: "Thonburi",Tahoma, Helvetica, sans-serif ;
  font-weight: normal;
  font-size: 12px;
  line-height:30px;
  color: #666666;
  /*
  -webkit-transition: all ease .3s;
  -o-transition: all ease .3s;
  -moz-transition: all ease .3s;
  -ms-transition: all ease .3s;
  transition: all ease .3s;
  */
  text-align : left;
  background-color: #e6e6e6;
  z-index:90;
  border-bottom:1px solid #000;
}

#cssmenu:before,
#cssmenu:after,
#cssmenu > ul:before,
#cssmenu > ul:after {
  content: '';
  display: table;
}
#cssmenu:after,
#cssmenu > ul:after {
  clear: both;
}
#cssmenu a {
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
#cssmenu ul {
  /*background: #3b5998;*/
  background-color: #22396d;
  border-radius: 3px;
  margin: 0 auto;
  /*
  border: 1px solid #2b4479;
  border: 1px solid #2d4373;
  */
  -webkit-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
  -o-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
  -moz-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
  -ms-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
  box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);

}

#cssmenu ul  ul{
	
  color : black;
  background: #e6e6e6; /*grey*/
  border-radius: 3px;
  /*
  border: 1px solid #2b4479;
  border: 1px solid #2d4373;
  */
  -webkit-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
  -o-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
  -moz-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
  -ms-box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);
  box-shadow: 0 1px 2px rgba(2, 2, 2, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.15);

}

#cssmenu ul > li {
  float: left;
  list-style: none;
}


#cssmenu ul > li > a {
  display: block;
  text-decoration: none;
  padding: 0px 10px;
  position: relative;
}
#cssmenu ul > li > a:hover {
  /*background: #2d4373;*/
  color : #33ccff; /*white blue*/
  background: #e6e6e6; /*grey*/
  /*
  -webkit-box-shadow: inset 0 0 1px #1e2e4f;
  -o-box-shadow: inset 0 0 1px #1e2e4f;
  -moz-box-shadow: inset 0 0 1px #1e2e4f;
  -ms-box-shadow: inset 0 0 1px #1e2e4f;
  box-shadow: inset 0 0 1px #1e2e4f;
  */
  /*
  -webkit-transition: all ease .3s;
  -o-transition: all ease .3s;
  -moz-transition: all ease .3s;
  -ms-transition: all ease .3s;
  transition: all ease .3s;
  */

}



#cssmenu ul > li > a:hover:before {
  content: '';
  z-index: 2;
  position: absolute;
  border: 0;
  border-top: 0;
  border-bottom: 0;
  border-right: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: -1px;
  opacity: .2;
  
}
#cssmenu ul > li > a:hover:after {
  content: '';
  z-index: 2;
  position: absolute;
  border: 0;
  border-top: 0;
  border-bottom: 0;
  border-left: 0;
  width: 100%;
  height: 100%;
  top: 0;
  right: -1px;
  opacity: .2;
  
}
#cssmenu > ul > li > ul {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  background-color: red;
  width: 350px;
}

#cssmenu > ul > li:hover > ul {
  opacity: 1;
  visibility: visible;
  position: absolute;
  border-radius: 0 0 3px 3px;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  box-shadow: none;
  
}

#cssmenu > ul > li > ul > li {
  float: none;
  position: relative;
}

#cssmenu > ul > li > ul > li > ul {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: 350px;
  top: 0px;
  width: 350px;
  /*width: auto;*/
}

#cssmenu > ul > li > ul > li > ul.reverse {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: -200px;
  top: 0px;
  width: 200px;
  /*width: auto;*/
}

#cssmenu > ul > li > ul > li:hover > ul {
  opacity: 1;
  visibility: visible;
  position: absolute;
    
}

#cssmenu > ul > li > ul > li > ul > li {
  float: none;
}


/* oc.htm */
.oc_title {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 40px;
	font-weight: bold;
	color: #224099;
	
}

.oc_staff_name {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 25px;
	font-weight: bold;
	color: #1B75BB;
	
}

.oc_staff_position {
	font-family: 'PSL-Kanda',Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;
	color:  #515152;
	
}
.box_left {
	float :left;
	width : 100%;
	height : 70px;
	overflow: hidden;
	text-overflow:ellipsis;
}

.span_block {
	display: block;
}


.text_nowrap {
	display: block;
	white-space: nowrap;
	text-overflow:ellipsis;
	overflow: hidden;
}

.box_list {
	display: list_item;
	list-style:none;
}
.box_left_220 {
	float :left;
	width : 220px;
	height : 70px;
	overflow: hidden;
	text-overflow:ellipsis;
}


.box_right {
	float :right;
}

.box_item_right {
	float : left;
	position: absolute;
	left: 249px;
	width: 250px;
	top: 4px;
	/*background-color: red;*/
}

#sitemap {
	position: absolute;
	top: 0;
	left:  850px;
	width: 138px;
	height: 25px;
	background-image:url('images/sitemap.png');
	background-repeat: no-repeat;
	z-index : 50;
}

#sitemap:hover {
	/*position: absolute;
	top: 0;
	left:  800px;
	width: 138px;
	height: 25px;*/
	cursor: pointer;
	background-image:url('images/sitemap_over.png');
	background-repeat: no-repeat;
	z-index : 50;
}

#login {
	position: absolute;
	top: 0;
	left:  1008px;
	width: 110px;
	height: 25px;
	background-image:url('images/login.png');
	background-repeat: no-repeat;
	z-index : 50;
}

#login:hover {
	/*position: absolute;
	top: 0;
	left:  1000px;
	width: 110px;
	height: 25px;*/
	cursor: pointer;
	background-image:url('images/login_over.png');
	background-repeat: no-repeat;
	/*z-index: 50;*/
}

#font_smaller {
	position: absolute;
	top: 5px;
	left:  1119px;
	width: 17px;
	height: 20px;
	background-image:url('images/smaller1.png');
	background-repeat: no-repeat;
}
#font_smaller:hover {
	cursor: pointer;
	background-image:url('images/smaller2.png');
	background-repeat: no-repeat;
}

#font_default {
	position: absolute;
	top: 5px;
	left:  1137px;
	width: 17px;
	height: 20px;
	background-image:url('images/default1.png');
	background-repeat: no-repeat;
	z-index : 50;	
}
#font_default:hover {
	cursor: pointer;
	background-image:url('images/default2.png');
	background-repeat: no-repeat;
}

#font_larger {
	position: absolute;
	top: 5px;
	left:  1155px;
	width: 17px;
	height: 20px;
	background-image:url('images/larger1.png');
	background-repeat: no-repeat;
	z-index : 50;
}
#font_larger:hover {
	cursor: pointer;
	background-image:url('images/larger2.png');
	background-repeat: no-repeat;
}


/*Styles for dim overlay & Popup box*/
#dim{ position:absolute; top:0; left:0; width:100%; z-index:300; background: url('images/dim.png'); display:none; text-align:left; }
.popupbox{
	position:fixed; width:840px; height:400px; 
	z-index:200; border:5px solid #222; 
	background: #FFF; top: 50%; left: 50%; 
	margin-top: -200px; margin-left: -420px;
	overflow : auto;
}
.popupbox img {border:none; margin:0px;}
.close{top:0px; float:right; }

#div_sitemap {
	clear :both;
}

a.no_style{
	text-decoration: none;
}
a:link {text-decoration:none;}      /* unvisited link */
a:visited {text-decoration:none;}  /* visited link */
a:hover {text-decoration:underline;}  /* mouse over link */
a:active {text-decoration:underline;}  /* selected link */

.detail_text_link{
font-family: "Thonburi",Tahoma, Helvetica, sans-serif ;
	font-size: 14px;
	color: black;
}
.detail_text_link:hover {
	font-family: "Thonburi",Tahoma, Helvetica, sans-serif ;
	font-size: 14px;
 	color : #33ccff; /*white blue*/
	text-decoration:underline;
}

.book_title {
	font-family: "Thonburi",Tahoma, Helvetica, sans-serif ;
	font-size: 13px;
	color: black;
	display: block;
	white-space: nowrap;
	text-overflow:ellipsis;
	overflow: hidden;
	width: 138px;
	text-align: center;
}

.detail_text_page {
	font-family: "Thonburi",Tahoma, Helvetica, sans-serif ;
	font-size: 14px;
	font-weight: bold;
	color: #0f77b6;
}



.container-shortcut-1{
	/*border	: 1px solid blue;*/
	width	: 935px;
	height	: 65px;
	clear	: both;
	float 	: left;
	margin-top		:25px;
	margin-left		:170px;
	margin-bottom	:5px;
}

#box-shortcut-1{

	border	: 0px solid blue;
	width	: 220px;
	height	: 65px;
	float 	: left;
	/*background-color: blue;
	background: url('images/06.jpg');
	background-repeat: no-repeat;*/
}


#box-shortcut-2{
	float 	: left;
	border	: 0px solid blue;
	width	: 220px;
	height	: 65px;
	margin-left	:12px;
}

#box-shortcut-3{
	float 	: left;
	border	: 0px solid blue;
	width	: 220px;
	height	: 65px;
	margin-left	:12px;
}

#box-shortcut-4{
	float 	: left;
	border	: 0px solid blue;
	width	: 220px;
	height	: 65px;
	margin-left	:12px;
}

#shortcut-1{
	background-color: pink;
	border: 1px solid red;
	width: 229;
	height:65;
	/*font-size: 8px;
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
	margin-top: 15px; */
}