@charset "utf-8";
/* リセットCSS */
@import "reset.css";


/* ハックCSS */
@import "hack.css";

/** 
 * ================================================================================
 * 希望の光くん　ホームページ
 * ================================================================================
 * 制作日: 2011-07-25
 * 変更日:
 *  2011-00-00 : kazu-watanabe
 *	Copyright  : エヌケー・テック株式会社
 */


/**
 * ベースCSS　目次
 * ================================================================================
 * =1	 	: 共通スタイル
 * 	=1-1   	: 初期設定
 * 	=1-2   	: ヘッダー
 * 	=1-3   	: メインコンテンツ
 * 	=1-4   	: メインメニュー
 * 	=1-5   	: フッター
 
 * =2	 	: トップページ
 * 	=2-1   	: 
 * 	=2-2   	: 
 * 	=2-3   	: 
 * 	=2-4   	: 
 * 	=2-5   	: 
 
 * =3	 	: 内部ページ
 * 	=3-1   	: 共通設定
 * 	=3-2   	: 
 * 	=3-3   	: 
 * 	=3-4   	: 
 * 	=3-5   	: 
 * ================================================================================
 */





/**=1
 * ================================================================================
 * 共通スタイル
 * ================================================================================
 */
	
	/**=1-1
	 * --------------------------------------
	 * 初期設定
	 * --------------------------------------
	 */
			
		/*　クラス
		--------------------------------------*/
			.Posi{position:relative;}
			.Posii {position:absolute; top:0; left:0;}
			.Left{float:left}
			.Right{float:right;}
			.Clear{clear:both;}
		
		
		/*　写真
		--------------------------------------*/
			.Img01{
				float: right;
				margin-bottom: 12px;
				margin-left: 12px;
			}
			
		
		/*　テキスト
		--------------------------------------*/
			.F-Bold{font-weight:bold;}
			.F-Red{color:#FF0000;}
			.F-SizeS{font-size:77%;}
			.F-SizeM{font-size:124%;}
			.L-Height100{line-height:100%;}
			.L-Height125{line-height:125%;}
		
		
		/*　背景
		--------------------------------------*/
			.Bg01{}
		
		
		/*　余白
		--------------------------------------*/
			.Mg05Bottom{margin-bottom:5px;}
			.Mg10Bottom{margin-bottom:10px;}
			.Mg20Bottom{margin-bottom:20px;}
			.Mg30Bottom{margin-bottom:30px;}
			
		
		/*　リンク
		--------------------------------------*/
			.Link01 a ,.Link01 a:link, .Link01 a:visited{color: #f10;}
			.Link01 a:hover, .Link01 a:focus, .Link01 a:active {color: #039;}
		
		
		/*　ボックス
		--------------------------------------*/
			.Box01{
				border:solid 1px #CCC;
				padding:12px;
				margin-left:12px;
				margin-right:12px;
			}
			
		
		/*　テーブル
		--------------------------------------*/
			.Table01{
				border-top:1px solid #767676;
				border-left:1px solid #767676;
				border-collapse:collapse;
			}
			.Table01 td{
				border-bottom:1px solid #767676;
				border-right:1px solid #767676;
				padding:5px;
			}
		
		
		/*　リスト
		--------------------------------------*/
			.List01{}
		
		
		/*　ライン
		--------------------------------------*/
			.Line01{}
		
	
	/**=1-2
	 * --------------------------------------
	 * ヘッダー
	 * --------------------------------------
	 */
		#Header {
			min-width: 950px;
			background: #f5f5f5;
			text-align: left;
		}
		#Header h1{
			width: 950px;
			margin: 0 auto;
			line-height: 100%;
			padding: 7px 0;
			font-weight: 100;
		}
	
	
	/**=1-3
	 * --------------------------------------
	 * メインコンテンツ
	 * --------------------------------------
	 */
		#Main{
			margin: 24px 0;
			float: left;
			width: 100%;
		}
		#Contents{
			width: 770px;
			float: left;
		}
	
	
	/**=1-4
	 * --------------------------------------
	 * メインメニュー
	 * --------------------------------------
	 */
		#GlobalNaviBg{
			background: url(../Images/All/Background/Header.gif) repeat-x;
			height: 75px;
			overflow: hidden;
		}
		#GlobalNavi {
			height: 75px;
			width: 950px;
			margin: 0 auto;
			background: url(../Images/All/Navi/Global.gif) no-repeat bottom;
		}
		
			#GlobalNavi a{
				height: 75px;
				display:block;
				overflow:hidden;
			}
			#GlobalNavi h2{
				float: left;
				width: 130px;
				text-indent: -9999px;
			}
			#GlobalNavi h2 a{ width: 130px;}
			#GlobalNavi ul{
				float: right;
				width: 660px;
			}
			
			#GlobalNavi ul li{
				float: left;
				text-indent: -9999px;
			}
		
			#GlobalNavi01,#GlobalNavi01 a{width: 170px;}
			#GlobalNavi02,#GlobalNavi02 a{width: 135px;}
			#GlobalNavi03,#GlobalNavi03 a{width: 100px;}
			#GlobalNavi04,#GlobalNavi04 a{width: 105px;}
			#GlobalNavi05,#GlobalNavi05 a{width: 150px;}
			
			#GlobalNavi ul li a{background: url(../Images/All/Navi/Global.gif) no-repeat;}
			
		
			#GlobalNavi ul li#GlobalNavi01 a{ background-position: -290px 0;}
			#GlobalNavi ul li#GlobalNavi02 a{ background-position: -460px 0;}
			#GlobalNavi ul li#GlobalNavi03 a{ background-position: -595px 0;}
			#GlobalNavi ul li#GlobalNavi04 a{ background-position: -695px 0;}
			#GlobalNavi ul li#GlobalNavi05 a{ background-position: -800px 0;}
			
			#GlobalNavi ul li a:hover{ background: none;}
			/*
			#GlobalNavi ul li#GlobalNavi01 a:hover{ background-position: -290px -75px;}
			#GlobalNavi ul li#GlobalNavi02 a:hover{ background-position: -460px -75px;}
			#GlobalNavi ul li#GlobalNavi03 a:hover{ background-position: -595px -75px;}
			#GlobalNavi ul li#GlobalNavi04 a:hover{ background-position: -695px -75px;}
			#GlobalNavi ul li#GlobalNavi05 a:hover{ background-position: -800px -75px;}*/
	
	
	/**=1-5
	 * --------------------------------------
	 * サブメニュー
	 * --------------------------------------
	 */
	 	#SubNavi{
			background: #eeeeee;
			width: 100%;
			clear: both;
			height: 50px;
		}
	 	#SubNavi p{
			float: right;
			width: 140px;
			height: 40px;
			margin: 5px;
			text-indent: -9999px;
		}
	 	#SubNavi p a{
			width: 140px;
			height: 40px;
			display: block;
			overflow: hidden;
			background: url(../Images/All/Navi/Pamphlet.gif) no-repeat;
		}
	 	#SubNavi p a:hover{ background-position: 0 -40px;}
		
	 	#SubNavi ul{
			width: 351px;
			float: left;
		}
	 	#SubNavi ul li{
			float: left;
			height: 50px;
			text-indent: -9999px;
		}
	 	#SubNavi ul li a{
			display: block;
			overflow: hidden;
			height: 50px;
			background: url(../Images/All/Navi/Sub.gif) no-repeat;
		}
	 	#SubNavi ul li#SubNavi01,#SubNavi ul li#SubNavi01 a{ width: 116px;}
	 	#SubNavi ul li#SubNavi02,#SubNavi ul li#SubNavi02 a{ width: 115px;}
	 	#SubNavi ul li#SubNavi03,#SubNavi ul li#SubNavi03 a{ width: 120px;}
		
		#SubNavi ul li#SubNavi01 a{ background-position: 0 0;}
		#SubNavi ul li#SubNavi02 a{ background-position: -116px 0;}
		#SubNavi ul li#SubNavi03 a{ background-position: -231px 0;}
		#SubNavi ul li#SubNavi01 a:hover{ background-position: 0 -50px;}
		#SubNavi ul li#SubNavi02 a:hover{ background-position: -116px -50px;}
		#SubNavi ul li#SubNavi03 a:hover{ background-position: -231px -50px;}
		
		
	/**=1-6
	 * --------------------------------------
	 * フッター
	 * --------------------------------------
	 */
		#FooterNavi {
			margin-top: 12px;
			padding-top: 12px;
			border-top: solid 1px #dddddd;
		}
		#FooterNavi p{
			float: right;
			width: 150px;
			height: 25px;
			text-indent: -9999px;
		}
		#FooterNavi p a{
			background: url(../Images/All/Navi/PageTop.gif) no-repeat;
			width: 150px;
			height: 25px;
			overflow: hidden;
			display: block;
		}
		#FooterNavi p a:hover{ background-position: 0 -25px;}
		
		#FooterNavi ul li{
			float: left;
			margin-left: 24px;
		}
		
		
	/**=1-6
	 * --------------------------------------
	 * フッター
	 * --------------------------------------
	 */
	 	#Footer{
			clear: both;
			border-top: solid 1px #333333;
			padding-top: 24px;
			font-size: 83%;
			min-width: 950px;
		}
	 	#Footer address{ float: right;}
	 	#Footer table td{
			border-left: solid 1px #dddddd;
			padding: 7px;
		}



/**=2
 * ================================================================================
 * トップページ
 * ================================================================================
 */
 	#MainImage{ margin-top: 24px;}
		
		
	/**=2-1
	 * --------------------------------------
	 * 
	 * --------------------------------------
	 */
	 	#Info{
			width: 250px;
			float: left;
		}
	 	#Info .Title{
			background: url(../Images/TopPage/Info.gif) no-repeat bottom;
			height: 20px;
			overflow: hidden;
			margin-bottom: 24px;
		}
	 	#Info .Title h2{ text-indent: -9999px;}
	 	#Info .Title p{
			float: right;
			width: 85px;
			height: 20px;
			text-indent: -9999px;
		}
	 	#Info .Title p a{
			display: block;
			overflow: hidden;
			width: 85px;
			height: 20px;
			background: url(../Images/TopPage/Info.gif) no-repeat top right;
		}
	 	#Info .Title p a:hover{ background: none;}
		
		#Info dt{
			color: #888888;
			margin-bottom: 3px;
		}
		#Info dd{
			padding-bottom: 7px;
			margin-bottom: 7px;
			border-bottom: solid 1px #CCCCCC;
		}
		#Info dd.Last{ border: none;}
		
	/**=2-2
	 * --------------------------------------
	 * 
	 * --------------------------------------
	 */
#OFF-15Percent,#Simulation{
float: left;
width: 145px;
margin-left: 20px;
}
#Simulation{
_margin-right: -3px;
}
#OFF-15Percent h2,#Simulation h2{
width: 145px;
height: 20px;
text-indent: -9999px;
margin-bottom: 7px;
}
#OFF-15Percent p,#Simulation p{
width: 145px;
height: 150px;
text-indent: -9999px;
}
#OFF-15Percent p a,#Simulation p a{
width: 145px;
height: 150px;
display: block;
overflow: hidden;
}

#OFF-15Percent h2{background: url(../Images/TopPage/Link01-Title.gif) no-repeat;}
#Simulation h2{background: url(../Images/TopPage/Link02-Title.gif) no-repeat;}

#OFF-15Percent p a{background: url(../Images/TopPage/Link01.jpg) no-repeat;}
#Simulation p a{background: url(../Images/TopPage/Link02.jpg) no-repeat;}

#OFF-15Percent p a:hover{ background-position: 0 -150px;}
#Simulation p a:hover{ background-position: 0 -150px;}
		
		
	/**=2-3
	 * --------------------------------------
	 * 
	 * --------------------------------------
	 */
	 	#Merit{
			float: left;
			width: 350px;
			margin-left: 20px;
		}
		
		
	 	#Merit h2{
			background: url(../Images/TopPage/Melit.gif) no-repeat;
			width: 120px;
			height: 20px;
			float: left;
			text-indent: -9999px;
			margin-bottom: 7px;
		}
		
	 	#Merit li{
			width: 350px;
			height: 150px;
			text-indent: -9999px;
			float: left;
		}
	 	#Merit li a{
			width: 350px;
			height: 150px;
			display: block;
		}
	 	#Merit li#Merit01 a{ background: url(../Images/TopPage/Merit/Merit01.jpg) no-repeat;}
	 	#Merit li#Merit02 a{ background: url(../Images/TopPage/Merit/Merit02.jpg) no-repeat;}
	 	#Merit li#Merit03 a{ background: url(../Images/TopPage/Merit/Merit03.jpg) no-repeat;}
	 	#Merit li#Merit04 a{ background: url(../Images/TopPage/Merit/Merit04.jpg) no-repeat;}
	 	#Merit li#Merit05 a{ background: url(../Images/TopPage/Merit/Merit05.jpg) no-repeat;}
		
	 	#Merit li#Merit01 a:hover{ background: url(../Images/TopPage/Merit/Merit01.jpg) no-repeat bottom;}
	 	#Merit li#Merit02 a:hover{ background: url(../Images/TopPage/Merit/Merit02.jpg) no-repeat bottom;}
	 	#Merit li#Merit03 a:hover{ background: url(../Images/TopPage/Merit/Merit03.jpg) no-repeat bottom;}
	 	#Merit li#Merit04 a:hover{ background: url(../Images/TopPage/Merit/Merit04.jpg) no-repeat bottom;}
	 	#Merit li#Merit05 a:hover{ background: url(../Images/TopPage/Merit/Merit05.jpg) no-repeat bottom;}


.window {
	height:150px;
	width: 350px;
	clear: both;
	overflow: hidden; /*--Hides anything outside of the set width/height--*/
	position: relative;
}
.image_reel {
	position: absolute;
	top: 0;
	left: 0;
}
.image_reel img {
	float: left;
}
/*--Paging Styles--*/
.paging {
	float: right;
	display: none; /*--Hidden by default, will be later shown with jQuery--*/
}
.paging a {
	line-height: 100%;
	padding: 5px 7px;
	background: #666666;
	text-decoration: none;
	color: #fff;
}
.paging a.active {
	background: #CCCCCC;
}


/**=3
 * ================================================================================
 * 内部ページ
 * ================================================================================
 */
		
		
	/**=3-1
	 * --------------------------------------
	 * 共通設定
	 * --------------------------------------
	 */
		#Contents h1{
			width: 770px;
			height: 50px;
			overflow: hidden;
			position: relative;
		}
		#Contents h1 img{
			position: absolute;
			top: 0;
			left: 0;
		}
	 
	 
	 	#SideNavi{
			width: 145px;
			height: 215px;
			float: right;
			background: url(../Images/All/Navi/Side.jpg) no-repeat right;
		}
	 	#SideNavi li{
			width: 145px;
			text-indent: -9999px;
		}
	 	#SideNavi li a{
			width: 145px;
			display: block;
			overflow: hidden;
			background: url(../Images/All/Navi/Side.jpg) no-repeat;
		}
		#SideNavi li a:hover{ background: none;}
	 	#SideNavi01,#SideNavi01 a{height: 90px;}
	 	#SideNavi02,#SideNavi02 a{height: 100px;}
	 	#SideNavi03,#SideNavi03 a{height: 25px;}
		
		#SideNavi li#SideNavi01 a{ background-position: 0 0;}
		#SideNavi li#SideNavi02 a{ background-position: 0 -90px;}
		#SideNavi li#SideNavi03 a{ background-position: 0 -190px;}
		
	/**=3-2
	 * --------------------------------------
	 * 
	 * --------------------------------------
	 */
		
		
	/**=3-3
	 * --------------------------------------
	 * 
	 * --------------------------------------
	 */