@charset "UTF-8";
/* ================================================ */
/*  レイアウト																			*/
/* ================================================ */
html{height:auto !important;}

/*----------------------------
	Body
----------------------------*/
body{
	width:100% ;
	font-size: 100% ;
	margin: 0 ;
	padding: 0 ;
	-webkit-text-size-adjust: 100%;
}

	#main_wrapper{
		min-width: 970px ;
		width: 100% ;
		margin: 0 auto ;
	}


@media screen and (max-width:767px ){
	body{}

		#main_wrapper{
			min-width: auto ;
		}
}


/*----------------------------
	Header	
----------------------------*/
/*  header  */
header{
	position: relative ;
	width: 970px ;
	margin: 0 auto ;
	z-index: 10 ;
	padding: 10px 0 7px 0 ;
}

	/*  h1  */
	header h1{
		margin: 0 ;
		padding: 0 0 0 30px ;
	}

	header h1#pT{ display: none ;}
	header h1#pU{ display: block ;}
	#page-index header h1#pT{ display: block ;}
	#page-index header h1#pU{ display: none ;}

		header h1 img{
			max-width: 100% ;
		}

	/*  SEO  */
	header #seo{
		position: absolute ;
		top:15px ;
		right: 0 ;
		font-size: 0.8rem ;
		font-weight: bold ;
	}

	.fontLarge header #seo{
		font-size: 0.7rem ;
	}

	/*  h_menu  */
	header #h_menu{
		width: 740px;
		position: absolute;
		display: table ;
		top: 60px;
		right: 0;
	}

	.fontLarge header #h_menu{
		width: 747px;
	}

		header #h_menu #h_entry{
			width: 130px ;
			display: table-cell ;
			vertical-align: middle ;
		}

		.fontLarge header #h_menu #h_entry{
			width: 120px ;
		}

			header #h_menu #h_entry a{
				display: block ;
				width: 95% ;
				padding: 10px 0 ;
				background:#DB6F05;
				color: #ffffff ;
				text-align: center ;
				text-decoration: none ;
				font-size: 0.8rem ;
			}

		header #h_menu #loginBlock{
			width: 200px;
			display: table-cell ;
			vertical-align: middle ;
		}

		header #h_menu #h_mypage{
			width: 135px ;
			display: table-cell ;
			vertical-align: middle ;
		}

		.fontLarge header #h_menu #h_mypage{
			width: 120px ;
		}

			header #h_menu #h_mypage a{
				display: block ;
				width: 95% ;
				padding: 10px 0 ;
				background:#0b9bd3;
				color: #ffffff ;
				text-align: center ;
				text-decoration: none ;
				font-size: 0.8rem ;
			}

		header #h_menu #h_bekkan{
			width: 130px ;
			display: table-cell ;
			vertical-align: middle ;
		}

		.fontLarge header #h_menu #h_bekkan{
			width: 120px ;
		}

			header #h_menu #h_bekkan a{
				display: block ;
				width: 100% ;
				padding: 10px 0 ;
				background: #0b9bd3;
				color: #ffffff ;
				text-align: center ;
				text-decoration: none ;
				font-size: 0.8rem ;
			}

		header #h_menu #h_logout{
			width: 130px ;
			display: table-cell ;
			vertical-align: middle ;
		}

		.fontLarge header #h_menu #h_logout{
			width: 120px ;
		}

			header #h_menu #h_logout a{
				display: block ;
				width: 95% ;
				padding: 10px 0 ;
				background:#333333;
				color: #ffffff ;
				text-align: center ;
				text-decoration: none ;
				font-size: 0.8rem ;
			}


		header #h_menu #chg_font,
		header #h_menu #chg_bg{
			display: table-cell ;
			vertical-align: middle ;
			box-sizing: border-box ;
		}

			header #h_menu #chg_font p,
			header #h_menu #chg_bg p{
				padding: 5px 0 5px 0 ;
				line-height: 1 ;
				background-position: left center ;
				background-repeat: no-repeat ;
				box-sizing: border-box ;
				font-size: 0.9rem ;
				margin: 0 ;
			}

				header #h_menu #chg_font a{
					text-decoration: none ;
					color: #000000 ;
				}

			header #h_menu #chg_bg{
				width: 145px;
				padding-left: 15px ;
			}

			header #h_menu #chg_bg p{
				width: 55px ;
				float: left ;
			}

				header #h_menu #chg_bg ul{
						width: 90px;
						float: left;
						padding: 0;
						margin: 0;
				}

						header #h_menu #chg_bg ul li{
							list-style: none ;
							display: inline-block ;
						}

							header #h_menu #chg_bg ul li a{
								position: relative ;
								display: block ;
								width: 25px ;
								padding:5px 0 ;
								border-radius:50px ;
								background-color: #e8e8e8 ;
								text-decoration: none ;
								font-size: 0.9rem ;
								line-height: 1; 
								text-align:center ;
								color:#ffffff ;
						}

						header #h_menu #chg_bg ul li.cwhite a{ background-color: #eeeeee ; color: #000000 ; }
						header #h_menu #chg_bg ul li.cblack a{ background-color: #000000 ; }
						header #h_menu #chg_bg ul li.cblue a{ background-color: #0669b2 ; }

				header #h_menu #chg_font{
					width: 164px;
					/* padding-left: 15px; */
				}

				.fontLarge header #h_menu #chg_font{
					width: 170px ;
				}

					header #h_menu #chg_font p{
						width: 85px;
						float: left;
					}

					.fontLarge header #h_menu #chg_font p{
						width: 95px ;
					}

					header #h_menu #chg_font ul{
						width:95px ;
						float: left ;
						padding: 0 ;
						margin: 0 ;
					}

						header #h_menu #chg_font ul li{
							list-style: none ;
							display: inline-block ;
						}

							header #h_menu #chg_font ul li a{
								position: relative ;
								display: block ;
								width: 25px ;
								padding:5px 0 ;
								border-radius:50px ;
								background-color: #e8e8e8 ;
								text-decoration: none ;
								font-size: 0.9rem ;
								line-height: 1; 
								text-align:center ;
							}


							.fontSmall header #h_menu #chg_font ul li.fsmall a,
							.fontMiddle header #h_menu #chg_font ul li.fnormal a,
							.fontLarge header #h_menu #chg_font ul li.fbig a{
								background: #767676 ;
								color: #ffffff ;
							}

  header #h_menu #sns{
   width: 110px;
   display: table-cell;
  }
   header #h_menu #sns ul{
    width: 100% ;
    text-align: center ;
   }
   header #h_menu #sns ul li{
    width: 35px ;
    list-style: none ;
    display: block ;
    float: right ;
    margin-left: 5px ;
   }
    header #h_menu #sns ul li img{
     max-width: 100% ;
    }


@media screen and (max-width:767px ){
	/*  header  */
	header{
		width: 100% ;
		padding: 10px 0 7px 0 ;
	}

		header h1{
			padding-left: 10px ;
		}

		/*  SEO  */
		header #seo{
			width: 95% ;
			position:relative;
			top:0 ;
			margin: 0 auto 5px auto ;
		}

			header #seo span{
				display: none ;
			}

		/*  h_menu  */
		header #h_menu{
			position: relative ;
			width: 95% ;
			margin: 10px auto ;
			display: block ;
			top: 0 ;
		}
	
			header #h_menu #chg_font,
			header #h_menu #chg_bg{
				display: none ;
			}
			header #h_menu #loginBlock{
				display: block ;
				width: 100% ;
				text-align: right ;
    margin-bottom: 10px ;
			}
		header #h_menu #h_entry,header #h_menu #h_bekkan{
			width: 48% ;
			max-width: 130px ;
			display: inline-block ;
		}
 
  header #h_menu #sns{
   width: 100%;
   display: block ;
  }

}

	
	
	
	

/*----------------------------
	Navigation	
----------------------------*/
#navigation{
	display: block ;
	position: relative ;
	width: 100% ;
	z-index: 5 ;
	padding: 5px 0 ;
	background: #0b9ad2 ;
}

		#navigation nav{
			width: 970px ;
			margin: 0 auto 0 auto ;
		}

			#navigation nav ul{
				margin: 0 auto ;
				overflow: hidden ;
			}

				#navigation nav ul li{
					width: 161.6px ;
					float: left ;
					list-style: none ;
					text-align: center ;
				}

					#navigation nav ul li a{
						position: relative ;
						display: block ;
						width: 100% ;
						padding: 15px 0 ;
						font-size: 0.9rem ;
						line-height: 1 ;
						color: #ffffff ;
						text-decoration: none ;
						box-sizing: border-box ;
					}

						#navigation nav ul li:nth-child(1) a:before{
							position: absolute;
							display: block;
							top: 9px;
							left: 0;
							content: '';
							width: 1px;
							height: 25px;
							border-left: 1px solid rgba(255,255,255,0.3) ;
						}

						#navigation nav ul li a:after{
							position: absolute ;
							top: 9px;
							right: 0 ;
							content: '';
							width: 1px;
							height: 25px;
							border-left: 1px solid rgba(255,255,255,0.3) ;
						}

	/*  SP : Navi  */
	#sp_navi{
		display: none ;
	}

@media screen and (max-width:767px ){
	#navigation{
		display: none ;
		padding: 0 ;
	}

		#navigation nav{
			width: 100% ;
		}

			#navigation nav ul li{
				width:100%;
				float: none ;
				border-bottom: 1px solid #ffffff ;
			}

				#navigation nav ul li a{
					padding: 15px 0 ;
				}

					#navigation nav ul li:nth-child(1) a:before{
						display: none ;
					}

					#navigation nav ul li a:after{
						display: none ;
					}


	/*  SP : Navi  */
	#sp_navi{
		display: block ;
	}

	#sp_navi{
		position: absolute;
		top: 63px;
		right: 5px;
		width: 50px;
		height: 45px;
		float: right;
	}


		#panel-btn{
			width: 100%;
			height:100%;
			display: inline-block;
			position: relative;
			padding: 0;
			text-indent: -9999em;
		}

			#panel-btn:after{
				position: absolute;
				content: 'MENU';
				display: block;
				bottom: -10px;
				width: 100%;
				height: 15px;
				text-indent: 0;
				font-size: 0.8rem;
				text-align: center;
				color: #0b9bd3;
			}

				#panel-btn-icon{
					display: block;
					position: absolute;
					top: 45%;
					left: 30%;
					width: 70%;
					height: 2px;
					margin: 0px 0 0 -7px;
					background: #0b9bd3;
					transition: .2s;
				}
				#panel-btn-icon:before, #panel-btn-icon:after{
					display: block;
					content: "";
					position: absolute;
					top: 58%;
					left: 0;
					width: 100%;
					height: 2px;
					background: #0b9bd3;
					transition: .3s;
				}
				#panel-btn-icon:before{
					margin-top: -13px;
				}
				#panel-btn-icon:after{
					margin-top: 11px;
				}
				#panel-btn .close{
					background: transparent;
					top: 38% ;
				}
				#panel-btn .close:before, #panel-btn .close:after{
					margin-top: 0;
				}
				#panel-btn .close:before{
					transform: rotate(-45deg);
					-webkit-transform: rotate(-45deg);
				}
				#panel-btn .close:after{
					transform: rotate(-135deg);
					-webkit-transform: rotate(-135deg);
				}
}
		
				
/*----------------------------
	main	
----------------------------*/
main{
	width:100% ;
	margin: 0 auto ;
	overflow: hidden ;
	position:relative ;
}

main#under{
	font-size:0.9rem;
}

@media screen and (max-width:767px ){
	main#under{
		padding-top: 15px ;
	}
}

	/*  スライド
  ------------------------------*/
	main #slider{
		width:100% ;
		margin: 0 auto 0 auto ;
	}

		main #slider ul{
			margin: 0 ;
			padding: 0 ;
			text-align: center ;
		}

	@media screen and (max-width:767px ){
		main #slider img{
			max-width: 100% ;
		}
	}

	/*  パンくず
  ------------------------------*/
	main #breadCrumbs{
		width:970px ;
		margin: 20px auto 0 auto ;
	}

		main #breadCrumbs a{
			text-decoration: none ;
			color: #0070b7 ;
		}

			main #breadCrumbs a:hover {
				text-decoration:underline;
			}

	@media screen and (max-width:767px ){
		main #breadCrumbs{
			display: none ;
		}
	}



	/*  コンテンツ
  ------------------------------*/
	main #contents{
		width:100% ;
		line-height: 1.6 ;
	}

		main .content{
			overflow: hidden ;
			padding: 50px 0 ;
			margin-right: auto ;
			margin-left: auto ;
		}

		/*  width:970px  */
		main#under .content{
			width: 970px ;
			margin: 0 auto ;
		}

		/*  width:100%  */
		main#under .content.bgColor{
			width: 100% ;
			margin: 0 auto ;
			background: #f3f3f3 ;
			padding: 40px 0 ;
		}

			main#under .content.bgColor .content_inner{
				width: 970px;
				margin: 0 auto ;
			}

	@media screen and (max-width:767px ){
		main #contents{
			width:100% ;
			margin: 0 auto ;
		}

			main#under .content{
				width:95% ;
				margin-left:auto ;
				margin-right:auto ;
		}

		main#under #contents .content:nth-child(1){
			padding-top: 0 ;
		}
		
			main#under .content.bgColor .content_inner{
				width: 95%;
			}
}


	/*  ページ下部バナー
  ------------------------------*/
	main #under_banner{
		width:900px ;
		padding: 30px 0 50px 0;
		margin: 0 auto ;
	}

		main #under_banner ul{
			width: 100% ;
			margin: 0 auto ;
			overflow: hidden ;
		}

			main #under_banner ul li{
				list-style: none ;
				float: left ;
				margin: 0 15px 15px 0 ;
				border: 1px solid #ccc ;
				text-align: center ;
			}

				main #under_banner ul li img{
					max-width: 100% ;
				}

	@media screen and (max-width:767px ){
		main #under_banner{
			width:95% ;
			padding: 15px 0 50px 0;
			margin: 0 auto ;
		}

			main #under_banner ul li:nth-child(odd){
				clear: both ;
				width: 48% ;
				margin: 0 0 15px 0 ;
			}

			main #under_banner ul li:nth-child(even){
				width: 48% ;
				float: right ;
				margin: 0 0 15px 0 ;
			}

	}


	
/*----------------------------
	Footer	
----------------------------*/
footer{
	position: relative;
	padding: 40px 0 15px 0;
	margin: 0 0 0 0;
	background: #0b9ad2;
	font-size: 0.9rem;
}

	footer #f_wrapper{
		width: 970px;
		margin: 0 auto 0px auto;
		text-align:center;
	}

		footer #f_wrapper #f_menu{
			margin: 0 auto 55px auto;
		}

			footer #f_wrapper #f_menu ul{
				margin: 0 auto ;
				text-align: center ;
			}

				footer #f_wrapper #f_menu ul li{
					display: inline-block ;
					list-style: none ;
					margin: 0 15px ;
				}

					footer #f_wrapper #f_menu ul li a{
						color: #ffffff ;
						text-decoration: none ;
					}

		footer #f_wrapper #f_information{
			margin: 0 auto 3;
			text-align: center;
			color: #ffffff;
		}

			footer #f_wrapper #f_information #f_address{
				margin: 0 auto 5px auto ;
			}

				footer #f_wrapper #f_information #f_address .tel{
					display: inline-block ;
					margin: 0 5px 0 15px ;
				}

			footer #f_wrapper #f_information #copyright{
				margin: 0 auto 5px auto ;
			}


@media screen and (max-width:767px ){
	footer #f_wrapper{
		width: 100%;
	}

		footer #f_wrapper #f_menu{
			margin: 0 auto 55px auto;
		}

			footer #f_wrapper #f_menu ul li{
				display: block ;
				margin: 0 15px 10px;
			}

	
			footer #f_wrapper #f_information #f_address{
				display: block ;
				margin: 0 auto 5px auto ;
			}
	
				footer #f_wrapper #f_information #f_address .tel{
					display: block ;
					margin: 0 5px 5px 0 ;
				}

			footer #f_wrapper #f_information #copyright{
				display: block ;
				margin: 0 auto 5px auto ;
			}
}

/*--------------------------------------
		pagetop
---------------------------------------*/
#pagetop{
	width: 970px ;
	margin: 50px auto 30px;
	text-align:center ;
}

	#pagetop a {
		position: relative ;
		display: block ;
		color: #888888 ;
		text-decoration: none ;
	}

		#pagetop a::before{
			position: absolute;
			display: block;
			content: '';
			left: 48.5%;
			top: -125%;
			width: 22px;
			height: 23px;
			border-top: 2px solid #888888;
			border-right: 2px solid #888888;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}

@media screen and (max-width:767px ){
	#pagetop{
		width: 100% ;
	}
}




/*--------------------------------------
		お気に入り企業一覧
---------------------------------------*/
#favorite{
	position:absolute;
	display: block ;
	right: 10px ;
	top: 180px ;
	z-index:10000;
}

#page-index #favorite{
	top: 660px ;
}

#page-index #favorite.fixed,
#favorite.fixed{
	position: fixed ;
	top: 10px ;
}

	#favorite a{
		display: block ;
		text-align: center ;
		width: 95px ;
		padding: 25px 0 ;
		border-radius:50px ;
		background: #0071b7 ;
		color: #ffffff ;
		text-decoration: none ;
		line-height: 1.6 ;
		font-size: 0.9rem ;
	}

	.fontSmall #favorite a{
		padding: 30px 0 ;
	}
	.fontLarge #favorite a{
		padding: 20px 0 ;
	}


@media screen and (max-width:767px ){
	#favorite{
		position:relative;
		width: 95% ;
		margin: 10px auto ;
		right:0 ;
		top: 0 ;
	}

	#favorite.fixed,
	#page-index #favorite.fixed{
		position:relative ;
		top: 0 ;
	}

		#favorite a{
			position: relative ;
			display: block ;
			text-align: center ;
			width: 100% ;
			padding: 10px 0 10px 10px ;
			border-radius:0 ;
			text-align: left ;
			box-sizing:border-box ;
		}

			#favorite a br{
				display: none ;
			}
	
			#favorite a::before{
				position: absolute ;
				content: '' ;
				top: 15px ;
				right: 15px;
				width: 8px;
				height: 8px;
				border-top: 1px solid #ffffff;
				border-right: 1px solid #ffffff;
				-webkit-transform: rotate(45deg);
				transform: rotate(45deg);
			}
}




/*--------------------------------------
		アクセスランキング
---------------------------------------*/
#accessRanking{
	position:absolute;
	display: block ;
	right: 10px ;
	top: 15px ;
	z-index:10000;
}

#page-index #accessRanking{
	top: 500px ;
}

#page-index #accessRanking.fixed,
#accessRanking.fixed{
	position: fixed ;
	top: 10px ;
}

	#accessRanking a{
		display: block ;
		text-align: center ;
		width: 95px ;
		padding: 25px 0 ;
		border-radius:50px ;
		background: #0071b7 ;
		color: #ffffff ;
		text-decoration: none ;
		line-height: 1.6 ;
		font-size: 0.9rem ;
	}

	.fontSmall #accessRanking a{
		padding: 30px 0 ;
	}
	.fontLarge #accessRanking a{
		padding: 20px 0 ;
	}


@media screen and (max-width:767px ){
	#accessRanking{
		position:relative;
		width: 95% ;
		margin: 10px auto ;
		right:0 ;
		top: 0 ;
	}

	#accessRanking.fixed,
	#page-index #accessRanking.fixed{
		position:relative ;
		top: 0 ;
	}

		#accessRanking a{
			position: relative ;
			display: block ;
			text-align: center ;
			width: 100% ;
			padding: 10px 0 10px 10px ;
			border-radius:0 ;
			text-align: left ;
			box-sizing:border-box ;
		}

			#accessRanking a br{
				display: none ;
			}
	
			#accessRanking a::before{
				position: absolute ;
				content: '' ;
				top: 15px ;
				right: 15px;
				width: 8px;
				height: 8px;
				border-top: 1px solid #ffffff;
				border-right: 1px solid #ffffff;
				-webkit-transform: rotate(45deg);
				transform: rotate(45deg);
			}
}


#ranking{
	width: 95% ;
	margin: 30px auto ;
	overflow: hidden ;
}

	#ranking h1{
		margin: 0 auto 15px auto ;
		text-align: center ;
		font-size: 1.5rem ;
		background: #0b9ad2 ;
		padding: 10px 0 ;
		color: #ffffff ;
	}

	#ranking .note{
		margin: 0 auto 10px auto ;
		text-align: right ;
	}

	#ranking .box{
		width: 48% ;
		float: left ;
		background: #ebf9ff ;
		padding:15px ;
		box-sizing: border-box ;
	}

		#ranking .box:nth-child(even){
			float: right ;
		}

		#ranking .box h2{
			border-bottom : 4px solid #0b9bd3 ;
			padding: 5px ;
			box-sizing: border-box ;
			color: #0b9bd3 ;
			font-size: 1.5rem ;
			margin: 0 auto 15px auto ;		
			
		}

		#ranking .box dl{
			width: 99% ;
			display: table ;
			margin: 0 auto 20px auto ;
			font-size: 1.2rem ;
		}

			#ranking .box dl dt{
				width: 80px ;
				display: table-cell ;
				text-align: center ;
				font-size: 1.6rem ;
			}

			#ranking .box dl dd{
				display: table-cell ;
			}

@media screen and (max-width:767px ){
	#ranking .box{
		width: 100%;
		float: none ;
		margin:0 auto 15px auto ;
	}

		#ranking .box:nth-child(even){
			float: none ;
		}
}