@charset "utf-8";
@import url("contents.css");

body {
	background: #fff;
}

#wrap {
	width: 752px;
	padding: 0 4px;
	margin: 0 auto;
	background: url(../img/wrap_bg.gif) repeat-y;
	font-size: 100%;
	line-height: 105%;
}

	#header {
		width: 750px;
		height: 78px;
		padding: 0 1px 1px 1px;
		background: url(../img/header_bg.gif) no-repeat 1px 0;
		border-bottom: 1px solid #dadada;
		position: relative;
	}
	
		h1 {
			position: absolute;
			left: 23px;
			top: 5px;
		}
		
		ul.headerMenu {
			position: absolute;
			top: 5px;
			left: 542px;
		}
		
		ul.headerMenu li {
			width: 112px;
			padding: 0 0 1px 0;
		}
		
		ul.headerMenu li.headerMenu1 {
			background: url(../img/index_hmenu_1.gif) no-repeat left top;
			height: 23px;
		}
		
		ul.headerMenu li.headerMenu2 {
			background: url(../img/index_hmenu_2.gif) no-repeat left top;
			height: 32px;
		}


		ul.headerMenu li.headerMenu3 {
			background: url(../img/index_hmenu_3.gif) no-repeat left top;
		}

		ul.headerMenu li a {
			display: block;
			width: 112px;
			height: 23px;
			text-indent: -9999px;
		}
	
	#contents {
		clear: both;
		width: 752px;
		padding: 6px 0 0 0;
	}

		#main {
			width: 550px;
			float: right;
			padding: 5px 0 0 0;
		}
		
		#mainTop {}
		
			#panNavi {
				padding: 5px 0 5px 20px;
				background: url(../img/pan_bg.gif) no-repeat 6px 8px;
				color: #000;
			}
			
			#panNavi span {
				color: #999;
			}
			
			#panNavi a {
				text-decoration: none;
				color: #000;
			}
			
			#mainHeader {
				background: url(../img/h2_bg.gif) repeat-x left top;
				width: 550px;
				height: 52px;
				border-bottom: 3px solid #15ae0c;
			}
				h2 {
					width: 250px;
					height: 52px;
					float: left;
					text-indent: -9999px;
				}
				
				#mainHeader ul {
					float: right;
					width: 230px;
					height: 33px;
					padding: 10px 0 0 0;
				}
				
				#mainHeader ul li {
					width: 110px;
					height: 33px;
					float: left;
					margin: 0 5px 0 0;
				}
				
				#mainHeader ul li a {
					display: block;
					width: 110px;
					height: 33px;
					float: left;
					text-indent: -9999px;
					text-decoration: none;
				}
				
				#mainHeader ul li a:hover {
					text-decoration: none;
				}
				
				#mainHeader ul li.ryoukinBtn a {
					background: url(../img/ryoukin.gif) no-repeat left top;
				}
				
				#mainHeader ul li.graduBtn a {
					background: url(../img/gradu.gif) no-repeat left top;
				}
			
		#mainCon {
			width: 545px;
			padding: 15px 5px 0 0;
		}
			
			#subGnavi {
				width: 545px;
				height: 29px;
				border-bottom: 4px solid #f2f2f2;
			}
			
			#subGnavi ul {
				width: 545px;
				height: 28px;
				border-bottom: 1px solid #bcbbbb;
			}
			
			#subGnavi ul li {
				height: 28px;
				float: left;
				margin: 0 2px 0 0;
			}
			
			#subGnavi ul li.nomargin {
				margin: 0;
			}
			
			#subGnavi ul li a {
				display: block;
				text-decoration: none;
				text-indent: -9999px;
				height: 28px;
			}
			
			#subGnavi ul li a:hover,
			#subGnavi ul li a.current {
				background-position: left bottom !important;
				text-decoration: none !important;
			}
			

		#side {
			width: 200px;
			float:left;
			padding: 5px 0 30px 0;
		}
		
			ul#gNavi {
				width: 189px;
				padding: 0 0 5px 0;
				margin: 0 auto;
			}
			
			ul#gNavi li {
				width: 189px;
				height: 63px;
			}
			
			ul#gNavi li a {
				display: block;
				width: 189px;
				height: 63px;
				text-indent: -9999px;
				text-decoration: none;
			}
			
			ul#gNavi li.gNavi1 a {
				background: url(../img/navi1.gif) no-repeat left top;
			}
			
			ul#gNavi li.gNavi2 a {
				background: url(../img/navi2.gif) no-repeat left top;
			}
		
		
			ul#gNavi li.gNavi3 a {
				background: url(../img/navi3.gif) no-repeat left top;
			}
		
		
			ul#gNavi li.gNavi4 a {
				background: url(../img/navi4.gif) no-repeat left top;
			}
			
			ul#gNavi li a.current,
			ul#gNavi li a:hover {
				text-decoration: none;
				background-position: right top;
			}
		
			ul#sideBanner {
				clear: both;
				width: 186px;
				margin: 0 auto;
			}

			ul#sideBanner li {
				width: 186px;
				height: 42px;
				padding: 0 0 5px 0 ;
			}
			
			ul#sideBanner li a {
				display: block;
				width: 186px;
				height: 42px;
				text-indent: -9999px;
				text-decoration: none;
			}
			
			ul#sideBanner li.sideBanner1 a {
				background: url(../img/side_banner1.gif) no-repeat left top;
			}
			
			ul#sideBanner li.sideBanner2 a {
				background: url(../img/side_banner2.gif) no-repeat left top;
			}
		
		
			ul#sideBanner li.sideBanner3 a {
				background: url(../img/side_banner3.gif) no-repeat left top;
			}
		
			ul#sideBanner li a:hover {
				text-decoration: none;
			}
		
			ul#sideMenu {
				width: 183px;
				margin: 0 auto;
			} 
		
			ul#sideMenu li {
				width: 183px;
				height: 41px;
				padding: 0 0 4px 0 ;
			}
			
			ul#sideMenu li a {
				display: block;
				width: 183px;
				height: 41px;
				text-indent: -9999px;
				text-decoration: none;
			}
			ul#sideMenu li.sideMenu0 {
				height:70px;
			}
			
			ul#sideMenu li.sideMenu0 a {
				background: url(../img/left_banner.jpg) no-repeat left top;
				height:70px !important;
			}
			
			ul#sideMenu li.sideMenu1 a {
				background: url(../img/index_sub1.gif) no-repeat left top;
			}
			
			ul#sideMenu li.sideMenu2 a {
				background: url(../img/index_sub2.gif) no-repeat left top;
			}
		
		
			ul#sideMenu li.sideMenu3 a {
				background: url(../img/index_sub3.gif) no-repeat left top;
			}
			
			ul#sideMenu li.sideMenu4 a {
				background: url(../img/index_sub4.gif) no-repeat left top;
			}

		
			ul#sideMenu li a:hover {
				text-decoration: none;
				background-position: right top;
			}
		
/*----------- just for index.html */

#main.index {
	width: 752px;
	float: none;
}

	#mainFlash {
		float: right;
		width: 545;
		height: 243;
		margin:0 3px 0 0;
	}
	
	#indexNavi {
		float: left;
		width: 195px;
		background: url(../img/index_side_bg.gif) no-repeat left top;
		height: 243px;
		
	}
	
	#indexNavi ul li {
		width: 193px;
		height: 60px;
	}
	
	#indexNavi ul li a {
		display: block;
		width: 193px;
		height: 60px;
		text-indent: -9999px;
		text-decoration: none;
	}
	
	#indexNavi ul li.indexNavi1 a {
		background: url(../img/index_navi_1.gif) no-repeat left top;
	}
	
	#indexNavi ul li.indexNavi2 a {
		background: url(../img/index_navi_2.gif) no-repeat left top;
	}


	#indexNavi ul li.indexNavi3 a {
		background: url(../img/index_navi_3.gif) no-repeat left top;
	}


	#indexNavi ul li.indexNavi4 a {
		background: url(../img/index_navi_4.gif) no-repeat left top;
	}
	
	#indexNavi ul li a:hover {
		text-decoration: none;
		background-position: right top;
	}

	#indexBanner {
		clear: both;
		width: 752px;
		padding: 10px 0;
	}
	
	#indexBanner ul {
	padding: 0 0 0 3px;
	}
	
	#indexBanner ul li {
		width: 244px;
		height: 62px;
		float: left;
		padding: 0 5px 0 0 ;
	}
	
	#indexBanner ul li a {
		display: block;
		width: 244px;
		height: 62px;
		text-indent: -9999px;
		text-decoration: none;
	}
	
	#indexBanner ul li.indexBanner1 a {
		background: url(../img/index_banner1.gif) no-repeat left top;
	}
	
	#indexBanner ul li.indexBanner2 a {
		background: url(../img/index_banner2.gif) no-repeat left top;
	}


	#indexBanner ul li.indexBanner3 a {
		background: url(../img/index_banner3.gif) no-repeat left top;
	}
	
	#indexBanner ul li.indexBanner4 a {
		background: url(../img/index_banner4.gif) no-repeat left top;
	}
	
	#indexBanner ul li a:hover {
		text-decoration: none;
	}

	#indexSubMenu {
		width: 183px;
		float: left;
		padding: 0 9px 0 7px;
	} 

	#indexSubMenu ul li {
		width: 183px;
		height: 41px;
		float: none;
		padding: 0 0 4px 0 ;
	}
	
	#indexSubMenu ul li a {
		display: block;
		width: 183px;
		height: 41px;
		text-indent: -9999px;
		text-decoration: none;
	}
	#indexSubMenu ul li.indexSubMenu0 {
		height:70px;
	}
	#indexSubMenu ul li.indexSubMenu0 a {
		background: url(../img/left_banner.jpg) no-repeat left top;
		height:70px !important;
	}
	
	#indexSubMenu ul li.indexSubMenu1 a {
		background: url(../img/index_sub1.gif) no-repeat left top;
	}
	
	#indexSubMenu ul li.indexSubMenu2 a {
		background: url(../img/index_sub2.gif) no-repeat left top;
	}


	#indexSubMenu ul li.indexSubMenu3 a {
		background: url(../img/index_sub3.gif) no-repeat left top;
	}
	
	#indexSubMenu ul li.indexSubMenu4 a {
		background: url(../img/index_sub4.gif) no-repeat left top;
	}
	
	#indexSubMenu ul li a:hover {
		text-decoration: none;
		background-position: right top;
	}
	
	#whatsNew {
		float: left;
		width: 542px;
		height: 170px;
		border: 1px solid #ccc;
		margin-top:18px;
	}
	
	#newBoard {
		width: 335px;
		float: left;
	}
	
	#whatsNewB {
		border: 5px solid #f5f5f5;
		width: 522px;
		height: 140px;
		padding: 10px 5px;
	}
	
		dl.boardList dt {
			background: url(../img/whatsnew.gif) no-repeat left top;
			height: 26px;
			border-bottom: 1px dotted #22b24c;
			text-indent: -9999px;
		}
		
		dl.boardList dd {
			padding: 7px 20px 1px 5px;
		}
	
		dl.boardList dd.newsMark {
	background: url(../img/new_mark.gif) no-repeat right 7px;
		}
		
		dl.boardList dd.topicMark {
	background: url(../img/topic_mark.gif) no-repeat right 5px;
		}
		
		dl.boardList dd.camMark{
	background: url(../img/cam_mark.gif) no-repeat right 5px;
		}
		
		#freeDial {
			width:175px;
			height:110px;
			float: right;
			margin:25px 0 0 0;
		}
		
		#freeDial img {
			display: block;
			vertical-align: bottom;
		}


img.bnn {
	padding-top:10px;
}

/*----------- [end] just for index.html */
		
	#footer {
		clear: both;
		position: relative;
		width: 752px;
		height: 59px;
		padding: 10px 0 0 0;
		background: url(../img/footer_bg.gif) no-repeat left bottom;
	}
		
		ul.footerMenu {
		width:550px;
	position: absolute;
	left: 190px;
	top: 27px;
	font-size: 11px;
		}
		
		ul.footerMenu li {
			float: left;
			border-left: 1px solid #000;
			padding: 0 10px;
		}
		
		p.copyRight {
			position: absolute;
			left: 200px;
			top: 42px;
			font-size: 0.83em;
		}
		
		p.copyRight span {
			color: #fc513d;
			font-weight: bold;
		}